/**
 * Copyright 2012-2014 Evernote Corporation. All rights reserved.
 *
 * Shared header layout.
 */
/* Copyright 2012, Evernote Corp
 *
 * author: Andrei Thorp, athorp@evernote.com
 */
/*** Evernote CSS Framework ***/
.left {
  float: left !important;
}
.right {
  float: right !important;
}
/* =======================================================================================
   Copyright 2014 Evernote Corporation. All rights reserved.

   Icon

   There is some refactoring that needs to be done to make icons more consistent.
   We will need to work with design as well to make sure these are a little
   better defined.
   ==================================================================================== */
/* Icon
   =================================================================================== */
.Icon {
  display: inline-block;
  background-position: center center;
}
.Icon_small-downArrow {
  width: 9px;
  height: 5px;
}
@media all {
  .Icon_small-downArrow {
    background:  url('/redesign/global/img/menu-dropdown-arrow-white.png') center center transparent scroll no-repeat;
    -webkit-background-size: 9px 5px;
    -moz-background-size: 9px 5px;
    -o-background-size: 9px 5px;
    background-size: 9px 5px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_small-downArrow {
    background:  url('/redesign/global/img/menu-dropdown-arrow-white.png') center center transparent scroll no-repeat;
    -webkit-background-size: 9px 5px;
    -moz-background-size: 9px 5px;
    -o-background-size: 9px 5px;
    background-size: 9px 5px;
  }
}
.Icon_small-whiteShield {
  width: 32px;
  height: 32px;
}
@media all {
  .Icon_small-whiteShield {
    background:  url('/redesign/global/img/icon-shield-white.png') center center transparent scroll no-repeat;
    -webkit-background-size: 16px 16px;
    -moz-background-size: 16px 16px;
    -o-background-size: 16px 16px;
    background-size: 16px 16px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_small-whiteShield {
    background:  url('/redesign/global/img/icon-shield-white@2x.png') center center transparent scroll no-repeat;
    -webkit-background-size: 16px 16px;
    -moz-background-size: 16px 16px;
    -o-background-size: 16px 16px;
    background-size: 16px 16px;
  }
}
.Icon_small-upgradeTsp {
  width: 22px;
  height: 22px;
  position: relative;
  top: 5px;
  left: 0;
  display: none;
}
@media all {
  .Icon_small-upgradeTsp {
    background:  url('/redesign/global/img/icon-upgrade-arrow.png') center center transparent scroll no-repeat;
    -webkit-background-size: 22px 22px;
    -moz-background-size: 22px 22px;
    -o-background-size: 22px 22px;
    background-size: 22px 22px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_small-upgradeTsp {
    background:  url('/redesign/global/img/icon-upgrade-arrow@2x.png') center center transparent scroll no-repeat;
    -webkit-background-size: 22px 22px;
    -moz-background-size: 22px 22px;
    -o-background-size: 22px 22px;
    background-size: 22px 22px;
  }
}
@media only screen and (min-width: 60.875em) {
  .Icon_small-upgradeTsp {
    display: inline-block;
  }
}
/* Badges
 *
 * TODO: Refactor icons to be more standardized and reusable
 */
.Badge-free {
  width: 18px;
  height: 18px;
}
@media all {
  .Badge-free {
    background:  url('/redesign/global/img/badge-free.png') center center transparent scroll no-repeat;
    -webkit-background-size: 18px 18px;
    -moz-background-size: 18px 18px;
    -o-background-size: 18px 18px;
    background-size: 18px 18px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Badge-free {
    background:  url('/redesign/global/img/badge-free@2x.png') center center transparent scroll no-repeat;
    -webkit-background-size: 18px 18px;
    -moz-background-size: 18px 18px;
    -o-background-size: 18px 18px;
    background-size: 18px 18px;
  }
}
.Badge-premium {
  width: 16px;
  height: 18px;
}
@media all {
  .Badge-premium {
    background:  url('/redesign/global/img/badge-premium.png') center center transparent scroll no-repeat;
    -webkit-background-size: 16px 18px;
    -moz-background-size: 16px 18px;
    -o-background-size: 16px 18px;
    background-size: 16px 18px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Badge-premium {
    background:  url('/redesign/global/img/badge-premium@2x.png') center center transparent scroll no-repeat;
    -webkit-background-size: 16px 18px;
    -moz-background-size: 16px 18px;
    -o-background-size: 16px 18px;
    background-size: 16px 18px;
  }
}
/* Menu Icons
 *
 * TODO:
 *    - Refactor icons to be more standardized and reusable
 *    - Probably build out size specific sub modules
 */
.Icon_medium {
  width: 17px;
  height: 17px;
  margin: 0 8px 2px 0;
  vertical-align: middle;
}
.Icon_medium-gear {
  padding: 0;
}
@media all {
  .Icon_medium-gear {
    background:  url('/redesign/global/img/icon-settings.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_medium-gear {
    background:  url('/redesign/global/img/icon-settings@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all {
  .Icon_medium-questionMark {
    background:  url('/redesign/global/img/icon-help.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_medium-questionMark {
    background:  url('/redesign/global/img/icon-help@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all {
  .Icon_medium-chatBubble {
    background:  url('/redesign/global/img/icon-chat.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_medium-chatBubble {
    background:  url('/redesign/global/img/icon-chat@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all {
  .Icon_medium-arrowDoor {
    background:  url('/redesign/global/img/icon-logout.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_medium-arrowDoor {
    background:  url('/redesign/global/img/icon-logout@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 17px 17px;
    -moz-background-size: 17px 17px;
    -o-background-size: 17px 17px;
    background-size: 17px 17px;
  }
}
.Icon_medium-arrowRight {
  width: 9px;
  height: 13px;
  vertical-align: middle;
  margin-left: 4px;
}
@media all {
  .Icon_medium-arrowRight {
    background:  url('/redesign/global/img/icon-arrow.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 9px 13px;
    -moz-background-size: 9px 13px;
    -o-background-size: 9px 13px;
    background-size: 9px 13px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_medium-arrowRight {
    background:  url('/redesign/global/img/icon-arrow@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 9px 13px;
    -moz-background-size: 9px 13px;
    -o-background-size: 9px 13px;
    background-size: 9px 13px;
  }
}
/* Large Icons
 *
 * TODO:
 *    - Refactor icons to be more standardized and reusable
 *    - Probably build out size specific sub modules
 */
.Icon_large {
  width: 50px;
  height: 50px;
}
@media all {
  .Icon_large-shield {
    background:  url('/redesign/global/img/shield-large.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 50px 50px;
    -moz-background-size: 50px 50px;
    -o-background-size: 50px 50px;
    background-size: 50px 50px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_large-shield {
    background:  url('/redesign/global/img/shield-large@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 50px 50px;
    -moz-background-size: 50px 50px;
    -o-background-size: 50px 50px;
    background-size: 50px 50px;
  }
}
/* Super Icon
 *
 * TODO:
 *    - Refactor icons to be more standardized and reusable
 *    - Probably build out size specific sub modules
 */
.Icon_super {
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-background-size: 80px 60px;
  -moz-background-size: 80px 60px;
  -o-background-size: 80px 60px;
  background-size: 80px 60px;
  width: 80px;
  height: 60px;
  margin-left: -4px;
}
@media all {
  .Icon_super-lock {
    background-image: url('/redesign/global/img/go-premium-lock.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-lock {
    background-image: url('/redesign/global/img/go-premium-lock@2x.png');
  }
}
@media all {
  .Icon_super-plane {
    background-image: url('/redesign/global/img/go-premium-offline.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-plane {
    background-image: url('/redesign/global/img/go-premium-offline@2x.png');
  }
}
@media all {
  .Icon_super-screen {
    background-image: url('/redesign/global/img/go-premium-presentation.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-screen {
    background-image: url('/redesign/global/img/go-premium-presentation@2x.png');
  }
}
@media all {
  .Icon_super-mag-glass {
    background-image: url('/redesign/global/img/go-premium-search.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-mag-glass {
    background-image: url('/redesign/global/img/go-premium-search@2x.png');
  }
}
@media all {
  .Icon_super-clouds {
    background-image: url('/redesign/global/img/go-premium-upload.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-clouds {
    background-image: url('/redesign/global/img/go-premium-upload@2x.png');
  }
}
@media all {
  .Icon_super-heads {
    background-image: url('/redesign/global/img/go-premium-work.png');
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_super-heads {
    background-image: url('/redesign/global/img/go-premium-work@2x.png');
  }
}
/* Icon Shield
 *
 * TODO:
 *    - Refactor icons to be more standardized and reusable
 *    - Seems like this shouldn't a one off size
 */
.Icon_shield {
  width: 53px;
  height: 58px;
  margin-bottom: 20px;
}
@media all {
  .Icon_shield {
    background:  url('/redesign/global/img/premium-shield.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 53px 58px;
    -moz-background-size: 53px 58px;
    -o-background-size: 53px 58px;
    background-size: 53px 58px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_shield {
    background:  url('/redesign/global/img/premium-shield@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 53px 58px;
    -moz-background-size: 53px 58px;
    -o-background-size: 53px 58px;
    background-size: 53px 58px;
  }
}
.Icon_upgrade {
  width: 46px;
  height: 46px;
  vertical-align: top;
}
@media all {
  .Icon_upgrade {
    background:  url('/redesign/global/img/icon-upgrade.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 46px 46px;
    -moz-background-size: 46px 46px;
    -o-background-size: 46px 46px;
    background-size: 46px 46px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .Icon_upgrade {
    background:  url('/redesign/global/img/icon-upgrade@2x.png') 0 0 transparent scroll no-repeat;
    -webkit-background-size: 46px 46px;
    -moz-background-size: 46px 46px;
    -o-background-size: 46px 46px;
    background-size: 46px 46px;
  }
}
/* ===================================================================================
   Copyright 2014 Evernote Corporation. All rights reserved.

   Menu

   Menu that pops displays over top of other content.
   =================================================================================== */
/* Variables
   =================================================================================== */
/* Images */
/* Shading Helpers */
/* Utilities
   These should eventually be moved out to a utilities module
   =================================================================================== */
.u-inlineBlock {
  display: inline-block;
}
/* Module
   =================================================================================== */
.Menu {
  vertical-align: top;
  height: 100%;
  float: none;
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  /* Remove if at all possible */
}
#header-wrapper .Menu,
.wrapper-embed .Menu {
  height: 100%;
}
@media only screen and (min-width: 480px) and (max-width: 709px) {
  .Menu {
    display: none;
  }
}
@media only screen and (max-width: 479px) {
  .Menu {
    display: none;
  }
}
.Menu-activator {
  text-decoration: none;
  background-image: none;
  vertical-align: middle;
  height: 100%;
  margin-left: -4px;
  /* deal with inline-block's wiered left margin */
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
}
.Menu-activator:hover,
.Menu-activator:focus {
  text-decoration: none;
  outline: none;
}
.Menu-indicator {
  padding: 0 15px 0 10px;
  height: 100%;
  float: none;
}
.Menu-indicator > i {
  margin: 21px 0;
}
#header-wrapper .Menu-indicator > i,
.wrapper-embed .Menu-indicator > i {
  margin: 13px 0;
}
.Menu-popover {
  background-color: #f7f7f7;
  display: none;
  border: 1px solid #b5b5b5;
  position: absolute;
  z-index: 9998;
}
.Menu-popover.is-active {
  display: block;
}
/* ===================================================================================
   Copyright 2014 Evernote Corporation. All rights reserved.

   Menu User Nav extends Menu
   =================================================================================== */
/* Variables
   =================================================================================== */
/* Image Helper Variables */
/* Menu User Nav
   =================================================================================== */
.Menu_userNav-popover {
  border-width: 0 0 1px 1px;
  top: 49px;
  right: 0;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
#header-wrapper .Menu_userNav-popover,
.wrapper-embed .Menu_userNav-popover {
  top: 33px;
}
/* ===================================================================================
   Copyright 2014 Evernote Corporation.

   User

   Styling of Username and account type icon in the web header.
   =================================================================================== */
.User {
  color: #f2f2f2;
  font-size: 14px;
  font-family: gotham, Times, serif;
  font-style: normal;
  font-weight: 400;
  line-height: 48px;
  height: 100%;
  border-right: 0px;
  border-left: 0px;
  vertical-align: top;
  padding-left: 5px;
  /* Remove if at all possible */
}
:lang(zh-cn) .User {
  font-family: gotham, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
:lang(ja) .User {
  font-family: gotham, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.ie8 .User {
  font-family: gotham-400-normal, Times, serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .User {
  font-family: gotham-400-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
.ie8 :lang(ja) .User {
  font-family: gotham-400-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
#header-wrapper .User,
.wrapper-embed .User {
  line-height: 32px;
  width: auto;
  max-width: 440px;
}
.User-icon {
  margin-right: 4px;
  margin-left: 12px;
  vertical-align: middle;
}
.User-name {
  -o-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 300px;
  vertical-align: top;
  overflow: hidden;
}
.User-nameText {
  overflow: hidden;
  -o-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 300px;
  width: 100%;
  padding: 6px 0;
  display: inline;
  vertical-align: top;
}
/* =======================================================================================
   Copyright 2014 Evernote Corporation. All rights reserved.

   Nav

   Set up the base set of styles often needed for most navigation.
   Things like removing list styles types, padding, and margins.
   ==================================================================================== */
/* Nav
   =================================================================================== */
.Nav {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.Nav-anchor {
  text-decoration: none;
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: block;
}
.ie7 .Nav-anchor {
  zoom: 1;
}
.Nav-anchor:hover,
.Nav-anchor:focus {
  text-decoration: none;
}
/*  ======================================================================================
    Copyright 2014 Evernote Corporation. All rights reserved.

    User Nav (.Nav_userNav)

    User Nav extends Nav
    =================================================================================== */
/* User Nav
   =================================================================================== */
.Nav_userNav-left {
  vertical-align: top;
  padding-left: 1.84615385em;
  padding-left: 2rem;
  padding-right: 1.84615385em;
  padding-right: 2rem;
  padding-bottom: 3.07692308em;
  padding-bottom: 3.33333333rem;
}
.Nav_userNav-right {
  padding-left: 1.46153846em;
  padding-left: 1.58333333rem;
  padding-right: 1.84615385em;
  padding-right: 2rem;
  padding-bottom: 3.07692308em;
  padding-bottom: 3.33333333rem;
}
.Nav_userNav-item {
  padding-top: 0.76923077em;
  padding-top: 0.83333333rem;
}
.ie7 .Nav_userNav-item {
  zoom: 1;
}
.Nav_userNav-anchor-right .Nav_userNav-anchor {
  text-transform: uppercase;
}
.Nav_userNav-anchor,
.Nav_userNav-anchor:visited {
  color: #646e71;
  font-family: gotham, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.16666667em;
  font-size: 1.16666667rem;
  line-height: 2;
  padding: 0 0.61538462em;
  padding: 0 0.66666667rem;
  border-width: 0;
  border-radius: 1.92307692em;
  border-radius: 2.08333333rem;
  -webkit-transition: all 0.1s ease-in;
  -moz-transition: all 0.1s ease-in;
  -ms-transition: all 0.1s ease-in;
  -o-transition: all 0.1s ease-in;
  transition: all 0.1s ease-in;
}
:lang(zh-cn) .Nav_userNav-anchor,
:lang(zh-cn) .Nav_userNav-anchor:visited {
  font-family: gotham, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
:lang(ja) .Nav_userNav-anchor,
:lang(ja) .Nav_userNav-anchor:visited {
  font-family: gotham, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.ie8 .Nav_userNav-anchor,
.ie8 .Nav_userNav-anchor:visited {
  font-family: gotham-400-normal, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .Nav_userNav-anchor,
.ie8 :lang(zh-cn) .Nav_userNav-anchor:visited {
  font-family: gotham-400-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
.ie8 :lang(ja) .Nav_userNav-anchor,
.ie8 :lang(ja) .Nav_userNav-anchor:visited {
  font-family: gotham-400-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.Nav_userNav-anchor:hover,
.Nav_userNav-anchor:focus {
  outline: none;
  border: 1px;
  border-color: #C4CBCF;
  background-color: #c9d1d7;
}
.Nav_userNav-anchor:active {
  background-color: #BCC4C9;
}
/* ===================================================================================
   Copyright 2014 Evernote Corporation. All rights reserved.

   Menu Banner
   =================================================================================== */
/* Variables
   =================================================================================== */
/* Colors */
/* Images */
/* Menu Banner
   =================================================================================== */
.MenuBanner {
  padding: 17px 30px 12px;
}
.MenuBanner_goPremium {
  border-top: 1px solid #d9e4e7;
}
.MenuBanner_goPremiumOld {
  border-top: 1px solid #dfe8eb;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
@media all {
  .MenuBanner_goPremiumOld {
    background:  url('/redesign/global/img/chevron-blue-bg.png') left top scroll repeat;
    -webkit-background-size: 50px 30px;
    -moz-background-size: 50px 30px;
    -o-background-size: 50px 30px;
    background-size: 50px 30px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .MenuBanner_goPremiumOld {
    background:  url('/redesign/global/img/chevron-blue-bg@2x.png') left top scroll repeat;
    -webkit-background-size: 50px 30px;
    -moz-background-size: 50px 30px;
    -o-background-size: 50px 30px;
    background-size: 50px 30px;
  }
}
.MenuBanner_goPremium-message {
  display: inline-block;
  margin-left: 18px;
}
.MenuBanner_goPremium-title {
  color: #039924;
  font-family: caecilia, Times, serif;
  font-style: normal;
  font-weight: 700;
  font-size: 14px;
  width: 215px;
  line-height: 18px;
  margin-bottom: 0;
  text-align: left;
}
:lang(zh-cn) .MenuBanner_goPremium-title {
  font-family: caecilia, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
:lang(ja) .MenuBanner_goPremium-title {
  font-family: caecilia, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.ie8 .MenuBanner_goPremium-title {
  font-family: caecilia-700-normal, Times, serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .MenuBanner_goPremium-title {
  font-family: caecilia-700-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
.ie8 :lang(ja) .MenuBanner_goPremium-title {
  font-family: caecilia-700-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.MenuBanner_goPremium-anchor {
  color: #747474;
  font-family: gotham, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 12px;
  line-height: 16px;
  text-decoration: none;
  width: auto;
  padding: 0;
}
:lang(zh-cn) .MenuBanner_goPremium-anchor {
  font-family: gotham, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
:lang(ja) .MenuBanner_goPremium-anchor {
  font-family: gotham, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.ie8 .MenuBanner_goPremium-anchor {
  font-family: gotham-700-normal, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .MenuBanner_goPremium-anchor {
  font-family: gotham-700-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
.ie8 :lang(ja) .MenuBanner_goPremium-anchor {
  font-family: gotham-700-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.MenuBanner_goPremium-anchor,
.MenuBanner_goPremium-anchor:visited {
  color: #747474;
}
.MenuBanner_goPremium-anchor:hover,
.MenuBanner_goPremium-anchor:active {
  border: none;
  background-color: #f7f7f7;
}
.MenuBanner_paymentDue-anchor,
.MenuBanner_paymentDue-anchor:link,
.MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia, Times, serif;
  font-style: italic;
  font-weight: 300;
  font-size: 14px;
}
:lang(zh-cn) .MenuBanner_paymentDue-anchor,
:lang(zh-cn) .MenuBanner_paymentDue-anchor:link,
:lang(zh-cn) .MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
:lang(ja) .MenuBanner_paymentDue-anchor,
:lang(ja) .MenuBanner_paymentDue-anchor:link,
:lang(ja) .MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.ie8 .MenuBanner_paymentDue-anchor,
.ie8 .MenuBanner_paymentDue-anchor:link,
.ie8 .MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia-300-italic, Times, serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .MenuBanner_paymentDue-anchor,
.ie8 :lang(zh-cn) .MenuBanner_paymentDue-anchor:link,
.ie8 :lang(zh-cn) .MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia-300-italic, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
.ie8 :lang(ja) .MenuBanner_paymentDue-anchor,
.ie8 :lang(ja) .MenuBanner_paymentDue-anchor:link,
.ie8 :lang(ja) .MenuBanner_paymentDue-anchor:visited {
  font-family: caecilia-300-italic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.MenuBanner_paymentDue-anchor:hover {
  border: none;
  background-color: #f7f7f7;
}
.MenuBanner_paymentDue-anchor:active {
  background-color: #f7f7f7;
}
/*************************************************
 * Banner:banner()
*************************************************/
.Banner-title {
  line-height: 49px;
  height: 100%;
  vertical-align: top;
  font-family: caecilia, Times, serif;
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  color: #ffffff;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 15px;
}
:lang(zh-cn) .Banner-title {
  font-family: caecilia, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
:lang(ja) .Banner-title {
  font-family: caecilia, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.ie8 .Banner-title {
  font-family: caecilia-700-normal, Times, serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .Banner-title {
  font-family: caecilia-700-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, serif;
}
.ie8 :lang(ja) .Banner-title {
  font-family: caecilia-700-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, serif;
}
.Banner-upgradeTspWrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  text-align: center;
}
.Banner-upgradeTsp {
  font-family: gotham, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  color: #2f373d;
  display: none;
  padding-top: 18px;
}
:lang(zh-cn) .Banner-upgradeTsp {
  font-family: gotham, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
:lang(ja) .Banner-upgradeTsp {
  font-family: gotham, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.ie8 .Banner-upgradeTsp {
  font-family: gotham-500-normal, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .Banner-upgradeTsp {
  font-family: gotham-500-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
.ie8 :lang(ja) .Banner-upgradeTsp {
  font-family: gotham-500-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
@media only screen and (min-width: 60.875em) {
  .Banner-upgradeTsp {
    display: inline-block;
  }
}
.header .left {
  height: 49px;
}
.Banner-divider {
  width: 0;
  height: 100%;
  vertical-align: top;
  border-right: 1px solid rgba(17, 118, 4, 0.4);
  border-left: 1px solid rgba(255, 255, 255, 0.3);
}
.logo-bar .Banner-divider,
.Banner-divider.short {
  height: 23px;
  margin-top: 13px;
}
.header {
  background-color: #00a82d;
  width: 100%;
  height: 49px;
  /*
     * Bug where media queries hide .header on smaller screens in web client
     * WEB-14339 & WEB-14338
     */
}
#header-wrapper .header,
.wrapper-embed .header {
  display: block;
  height: 32px;
}
.header-light {
  background-color: transparent;
}
.header-inner {
  height: 49px;
}
.header-inner:before,
.header-inner:after {
  display: table;
  content: "";
}
.header-inner:after {
  clear: both;
}
.ie8 .header-inner {
  zoom: 1;
}
.header-inner .referral-promo:link,
.header-inner .referral-promo:hover,
.header-inner .referral-promo:active,
.header-inner .referral-promo:visited {
  display: inline-block;
  font-family: gotham, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 12px;
  color: #ffffff;
  height: 27px;
  line-height: 1em;
  padding: 5px 0 0 0;
  text-decoration: none;
}
:lang(zh-cn) .header-inner .referral-promo:link,
:lang(zh-cn) .header-inner .referral-promo:hover,
:lang(zh-cn) .header-inner .referral-promo:active,
:lang(zh-cn) .header-inner .referral-promo:visited {
  font-family: gotham, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
:lang(ja) .header-inner .referral-promo:link,
:lang(ja) .header-inner .referral-promo:hover,
:lang(ja) .header-inner .referral-promo:active,
:lang(ja) .header-inner .referral-promo:visited {
  font-family: gotham, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
.ie8 .header-inner .referral-promo:link,
.ie8 .header-inner .referral-promo:hover,
.ie8 .header-inner .referral-promo:active,
.ie8 .header-inner .referral-promo:visited {
  font-family: gotham-700-normal, helvetica, arial, sans-serif;
  font-style: normal;
  font-weight: normal;
}
.ie8 :lang(zh-cn) .header-inner .referral-promo:link,
.ie8 :lang(zh-cn) .header-inner .referral-promo:hover,
.ie8 :lang(zh-cn) .header-inner .referral-promo:active,
.ie8 :lang(zh-cn) .header-inner .referral-promo:visited {
  font-family: gotham-700-normal, Hiragino Sans GB, STHeiti, Microsoft Yahei, helvetica, arial, sans-serif;
}
.ie8 :lang(ja) .header-inner .referral-promo:link,
.ie8 :lang(ja) .header-inner .referral-promo:hover,
.ie8 :lang(ja) .header-inner .referral-promo:active,
.ie8 :lang(ja) .header-inner .referral-promo:visited {
  font-family: gotham-700-normal, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", helvetica, arial, sans-serif;
}
@media all {
  .header-inner .referral-promo:hover,
  .header-inner .referral-promo:active {
    background:  url('/redesign/global/img/header-highlight.png') bottom transparent no-repeat;
    -webkit-background-size: 100% 25px;
    -moz-background-size: 100% 25px;
    -o-background-size: 100% 25px;
    background-size: 100% 25px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .header-inner .referral-promo:hover,
  html:not(.ie8) .header-inner .referral-promo:active {
    background:  url('/redesign/global/img/header-highlight@2x.png') bottom transparent no-repeat;
    -webkit-background-size: 100% 25px;
    -moz-background-size: 100% 25px;
    -o-background-size: 100% 25px;
    background-size: 100% 25px;
  }
}
.header-inner .referral-promo .referral-promo-icon {
  display: inline-block;
  position: relative;
  top: 4px;
  margin: 0 4px 0 10px;
  width: 13px;
  height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media all {
  .header-inner .referral-promo .referral-promo-icon {
    background:  url('/redesign/global/img/header-referral-promo.png') no-repeat bottom;
    -webkit-background-size: 13px 16px;
    -moz-background-size: 13px 16px;
    -o-background-size: 13px 16px;
    background-size: 13px 16px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) .header-inner .referral-promo .referral-promo-icon {
    background:  url('/redesign/global/img/header-referral-promo@2x.png') no-repeat bottom;
    -webkit-background-size: 13px 16px;
    -moz-background-size: 13px 16px;
    -o-background-size: 13px 16px;
    background-size: 13px 16px;
  }
}
.header-inner .go-premium-promo {
  display: none;
}
.header-inner .go-premium-promo:link,
.header-inner .go-premium-promo:hover,
.header-inner .go-premium-promo:active,
.header-inner .go-premium-promo:visited {
  color: #ffffff;
  font-weight: bold;
  font-size: 12px;
  line-height: 32px;
  text-decoration: none;
  height: 32px;
  vertical-align: top;
  margin-right: 32px;
}
#header-wrapper .header-inner .go-premium-promo {
  display: inline-block;
}
.header-inner .go-premium-promo .Icon {
  vertical-align: top;
}
#header-wrapper .header-inner,
.wrapper-embed .header-inner {
  height: 32px;
}
.header-inner .Btn {
  font-size: 1.08333333em;
  font-size: 1.08333333rem;
  line-height: 1.84615385;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ffffff;
  background-color: #00a82d;
  border-color: #ffffff;
  min-height: 1.84615385em;
  min-height: 2rem;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  margin: 11px 8px 10px 11px;
}
.header-inner .Btn:hover,
.header-inner .Btn:active {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  color: #00a82d;
  background-color: #ffffff;
  border-color: #ffffff;
}
#header-wrapper .header-inner .Btn,
.wrapper-embed .header-inner .Btn {
  display: none;
}
.header-inner .right {
  display: table-cell;
  vertical-align: middle;
  height: 49px;
}
#header-wrapper .header-inner .right,
.wrapper-embed .header-inner .right {
  height: 32px;
}
@media only screen and (max-width: 709px) {
  #header-wrapper .header-inner .right,
  .wrapper-embed .header-inner .right {
    display: inline-block;
    float: right;
  }
}
@media only screen and (max-width: 709px) {
  .header-inner .right {
    display: none;
  }
}
@media only screen and (max-width: 827px) {
  .user-wrapper .header-inner .right {
    display: none;
  }
}
.header-inner .Menu .gear_dropdown-user-caret {
  height: 49px;
  display: -moz-flex;
  display: -ms-flex;
  display: -webkit-flex;
  display: flex;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -webkit-justify-content: center;
  justify-content: center;
  fill: #f2f2f2;
}
.header-inner .Menu .gear_dropdown-user-caret svg {
  transform: rotate(90deg);
}
#header-wrapper .header-inner .Menu .gear_dropdown-user-caret,
.wrapper-embed .header-inner .Menu .gear_dropdown-user-caret {
  height: 32px;
}
.header-inner .Menu .User {
  color: #f2f2f2;
}
.header-inner .Menu.is-active .gear_dropdown-user-caret,
.header-inner .Menu:hover .gear_dropdown-user-caret {
  fill: #ffffff;
}
.header-inner .Menu.is-active .User,
.header-inner .Menu:hover .User {
  color: #ffffff;
}
.header-inner-light .Btn {
  color: #00a82d;
  background-color: #ffffff;
  border-color: #00a82d;
}
.header-inner-light .Btn:hover,
.header-inner-light .Btn:active {
  color: #ffffff;
  background-color: #00a82d;
  border-color: #00a82d;
}
.header-inner-light .evernote-logo .evernote-logo-2018-elephant {
  fill: #00a82d;
}
.header-inner-light .evernote-logo .evernote-logo-2018-text {
  fill: #000000;
}
.header-inner-light .Menu .gear_dropdown-user-caret {
  fill: #6a6a6a;
}
.header-inner-light .Menu .User {
  color: #6a6a6a;
}
.header-inner-light .Menu.is-active .gear_dropdown-user-caret,
.header-inner-light .Menu:hover .gear_dropdown-user-caret {
  fill: #6a6a6a;
}
.header-inner-light .Menu.is-active .User,
.header-inner-light .Menu:hover .User {
  color: #6a6a6a;
}
.header-inner-light .Menu.is-active {
  background-color: #f7f7f7;
}
.header-inner-light .Menu_userNav-popover {
  border-width: 0;
}
/*************************************************
 * Banner:branding()
*************************************************/
.evernote-logo {
  height: 49px;
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -webkit-inline-flex;
  display: inline-flex;
  -moz-flex-direction: column;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -moz-justify-content: center;
  -ms-justify-content: center;
  -webkit-justify-content: center;
  justify-content: center;
}
.evernote-logo svg {
  height: 27px;
}
.evernote-logo:focus {
  outline: none;
}
/*************************************************
 * Banner:Warning()
*************************************************/
.warning-container {
  float: right;
  line-height: 1em;
  display: inline-block;
}
.user-wrapper .warning {
  display: inline-block;
  vertical-align: top;
}
.warning a {
  color: #0b4906;
  font-family: helvetica;
  font-size: 11px;
  display: inline-block;
  height: 24px;
  padding: 7px 0px 0px 0px;
  vertical-align: top;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.user-wrapper .warning a {
  line-height: 1.0;
  height: 11px;
  padding: 20px 0 21px 0;
}
.warning a:hover {
  color: #052903;
}
#warningIcon {
  height: 32px;
  width: 16px;
  display: inline-block;
  margin: 0px 4px;
}
@media all {
  #warningIcon {
    background:  url('/redesign/global/img/payment-warning-icon.png') no-repeat 0 center;
    -webkit-background-size: 17px 16px;
    -moz-background-size: 17px 16px;
    -o-background-size: 17px 16px;
    background-size: 17px 16px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) #warningIcon {
    background:  url('/redesign/global/img/payment-warning-icon@2x.png') no-repeat 0 center;
    -webkit-background-size: 17px 16px;
    -moz-background-size: 17px 16px;
    -o-background-size: 17px 16px;
    background-size: 17px 16px;
  }
}
.user-wrapper #warningIcon {
  height: 52px;
}
#warningLinkIcon {
  height: 32px;
  width: 11px;
  display: inline-block;
  margin: 0px 4px;
}
@media all {
  #warningLinkIcon {
    background:  url('/redesign/global/img/link-arrow.png') no-repeat 0 center;
    -webkit-background-size: 8px 11px;
    -moz-background-size: 8px 11px;
    -o-background-size: 8px 11px;
    background-size: 8px 11px;
  }
}
@media all and (-moz-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3/2), all and (-webkit-min-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5), all and (min-resolution: 1.5dppx) {
  html:not(.ie8) #warningLinkIcon {
    background:  url('/redesign/global/img/link-arrow@2x.png') no-repeat 0 center;
    -webkit-background-size: 8px 11px;
    -moz-background-size: 8px 11px;
    -o-background-size: 8px 11px;
    background-size: 8px 11px;
  }
}
.user-wrapper #warningLinkIcon {
  height: 52px;
}
.opt-in-beta {
  display: inline-block;
}
.opt-in-beta .opt-in,
.opt-in-beta #try-it-button {
  display: inline-block;
  font-family: gotham, helvetica, arial, sans-serif;
  font-size: 12px;
  color: #ffffff;
  line-height: 1em;
  margin-right: 16px;
}
.opt-in-beta .opt-in {
  margin-top: 10px;
}
.opt-in-beta #try-it-button {
  cursor: pointer;
  border: 1px solid #ffffff;
  border-radius: 4px;
  padding: 5px 16px;
  background-color: #00a82d;
}
.opt-in-beta #try-it-button:hover,
.opt-in-beta #try-it-button:active {
  color: #00a82d;
  background-color: #ffffff;
}
