Skip to content

Instantly share code, notes, and snippets.

@keisuke0818

keisuke0818/0_index.html

Last active December 21, 2015 11:58
Show Gist options
  • Save keisuke0818/6302285 to your computer and use it in GitHub Desktop.
Save keisuke0818/6302285 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
0_index.html
<!DOCTYPE html>
<html data-fouc-class-names="swift-loading" lang="ja">
<head>
<meta charset="utf-8">
<title>Twitter</title>
<link href="./css/base.css" rel="stylesheet" type="text/css">
</head>
<body class="t1 logged-in user-style-Keisuke8Kurata asian ja" dir="ltr">
<div class="route-home" id="doc">
<div class="topbar js-topbar">
<div class="js-banners" id="banners"></div>
<div class="global-nav" data-section-term="top_nav">
<div class="global-nav-inner">
<div class="container">
<h1 class="icon bird-topbar-etched" style="display: inline-block; width: 24px; height: 21px;">
<span class="visuallyhidden">Twitter</span>
</h1>
<div role="navigation">
<ul class="nav js-global-actions" id="global-actions">
<li class="home active" data-global-action="home" id="global-nav-home">
<span class="text">ホーム</span>
</li>
<li class="people" data-global-action="connect">
<a class="js-nav" data-component-term="connect_nav" data-nav="connect" href="/i/connect" title="つながり">
<span class="text">つながり</span>
</a>
</li>
<li class="topics" data-global-action="discover">
<a class="js-nav" data-component-term="discover_nav" data-nav="discover" href="/i/discover" title="見つける">
<span class="text">見つける</span>
</a>
</li>
<li class="profile" data-global-action="profile">
<a class="js-nav" data-component-term="profile_nav" data-nav="profile" href="/Keisuke8Kurata" title="アカウント">
<span class="text">アカウント</span>
</a>
</li>
</ul>
</div>
<div class="pull-right">
<div role="search">
<form action="/search" class="form-search js-search-form" id="global-nav-search">
<label class="visuallyhidden" for="search-query">検索クエリ</label>
<input autocomplete="off" class="search-input" id="search-query" name="q" placeholder="検索" spellcheck="false" type="text">
<span class="search-icon js-search-action">
<button class="icon nav-search" type="submit">
<span class="visuallyhidden">
検索
</span>
</button>
</span>
<input autocomplete="off" class="search-input search-hinting-input" disabled="disabled" id="search-query-hint" spellcheck="false" type="text">
<div class="dropdown-menu typeahead">
<div class="dropdown-caret">
<div class="caret-outer"></div>
<div class="caret-inner"></div>
</div>
<div class="dropdown-inner js-typeahead-results">
<ul class="typeahead-items typeahead-topics">
<li class="typeahead-item typeahead-topic-item">
<a class="js-nav" data-ds="topics" data-query-source="typeahead_click" data-search-query="" href="" tabindex="-1">
<i class="generic-search"></i>
</a>
</li>
</ul>
<ul class="typeahead-items typeahead-trend-locations-list">
<li class="typeahead-item typeahead-trend-locations-item">
<a class="js-nav" data-ds="trend_location" data-search-query="" href="" tabindex="-1"></a>
</li>
</ul>
<ul class="typeahead-items typeahead-context-list">
<li class="typeahead-item typeahead-context-item">
<a class="js-nav" data-ds="context_helper" data-search-query="" href="" tabindex="-1"></a>
</li>
</ul>
</div>
</div>
</form>
</div>
</div>
<a class="close-all-tweets js-close-all-tweets" href="#" id="close-all-button" title="開いたすべてのツイートを閉じる">
<i class="nav-breaker"></i>
</a>
</div>
</div>
</div>
</div>
<div id="page-outer">
<div class="wrapper wrapper-home white" id="page-container">
<div class="dashboard">
<div class="module mini-profile">
<div class="flex-module profile-summary js-profile-summary">
<div class="profile-header-inner-overlay hidden"></div>
<a class="account-summary account-summary-small js-nav" data-nav="profile" href="/Keisuke8Kurata"></a>
<div class="content">
<div class="account-group js-mini-current-user" data-screen-name="Keisuke8Kurata" data-user-id="393347682">
<img alt="KeisukeKurata" class="avatar size32" data-user-id="393347682" src="https://si0.twimg.com/profile_images/1641250971/big_bird_normal.png">
<b class="fullname">KeisukeKurata</b>
<span class="screen-name hidden">@Keisuke8Kurata</span>
<small class="metadata">
プロフィールを見る
</small>
</div>
</div>
</div>
<div class="js-mini-profile-stats-container">
<ul class="stats js-mini-profile-stats" data-user-id="393347682">
<li>
<a class="js-nav" data-element-term="tweet_stats" data-nav="profile" href="/Keisuke8Kurata"><strong>109</strong>ツイート
</a>
</li>
<li>
<a class="js-nav" data-element-term="following_stats" data-nav="following" href="/following"><strong>62</strong>フォロー
</a>
</li>
<li>
<a class="js-nav" data-element-term="follower_stats" data-nav="followers" href="/followers"><strong>39</strong>フォロワー
</a>
</li>
</ul>
</div>
</div>
<div class="module wtf-module js-wtf-module">
<div class="flex-module">
<div class="flex-module-header">
<h3>おすすめユーザー</h3>
<small>&middot;</small>
<button class="btn-link js-refresh-suggestions" type="button">
<small>更新</small>
</button>
<small class="view-all">
&middot;
<a class="js-view-all-link" data-element-term="view_all_link" href="/who_to_follow/suggestions">すべて見る</a>
</small>
</div>
<div class="js-recommended-followers dashboard-user-recommendations flex-module-inner" data-section-id="wtf"></div>
<div class="flex-module-footer">
<a class="js-interests-link" data-element-term="interests_link" href="/who_to_follow/interests">
人気のアカウント
</a>
&middot;
<a class="js-find-friends-link" data-element-term="import_link" href="/who_to_follow/import">友だちを見つける</a>
</div>
</div>
</div>
<div class="module trends hidden">
<div class="flex-module trends-inner">
<div class="flex-module trends-container">
<div class="flex-module-header">
<h3>
<span class="js-trend-location">
世界中のトレンド
</span>
</h3>
<small>
&middot;
<a class="change-trends js-trend-toggle" data-modal="change-trends" href="#">変更する</a>
</small>
</div>
<div class="flex-module-inner">
<ul class="trend-items js-trends"></ul>
</div>
</div>
</div>
</div>
<div class="module site-footer">
<div class="flex-module">
<div class="flex-module-inner js-items-container">
<ul class="clearfix">
<li class="copyright">&copy; 2013 Twitter</li>
<li>
<a href="/about">Twitter社について</a>
</li>
<li>
<a href="//support.twitter.com">ヘルプ</a>
</li>
<li>
<a href="/tos">規約</a>
</li>
<li>
<a href="/privacy">プライバシー</a>
</li>
<li>
<a href="https://blog.twitter.com">ブログ</a>
</li>
<li>
<a href="http://status.twitter.com">ステータス</a>
</li>
<li>
<a href="/download">アプリ連携</a>
</li>
<li>
<a href="/about/resources">素材</a>
</li>
<li>
<a href="/jobs">求人</a>
</li>
<li>
<a href="https://business.twitter.com/ja/advertise/start">広告主</a>
</li>
<li>
<a href="https://business.twitter.com/ja">ビジネス</a>
</li>
<li>
<a href="//media.twitter.com">メディア</a>
</li>
<li>
<a href="//dev.twitter.com">開発者</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div aria-labelledby="content-main-heading" class="content-main" id="timeline" role="main">
<div class="content-header">
<div class="header-inner">
<h2 class="js-timeline-title" id="content-main-heading">ツイート</h2>
</div>
</div>
<div class="stream-container" data-max-id="367498237202431999" data-since-id="367511293520908289">
<div class="stream home-stream">
<ol class="stream-items js-navigable-stream" id="stream-items-id">
<li class="js-stream-item stream-item stream-item expanding-stream-item" data-item-id="367511293520908289" data-item-type="tweet" id="stream-item-tweet-367511293520908289">
<span class="icon dogear"></span>
<div class="content">
<div class="stream-item-header">
<a class="account-group js-account-group js-action-profile js-user-profile-link js-nav" data-user-id="45500849" href="/umekida">
<img alt="" class="avatar js-action-profile-avatar" src="https://si0.twimg.com/profile_images/378800000170336725/4371faef908cc50a879e258a4efc921e_normal.png">
<strong class="fullname js-action-profile-name show-popup-with-id">Yuhei Umeki</strong>
<span>&rlm;</span>
<span class="username js-action-profile-name">
<s>@</s>
<b>umekida</b>
</span>
</a>
<small class="time">
<a class="tweet-timestamp js-permalink js-nav" href="/umekida/status/367511293520908289" title="2013年8月13日 - 19:01">
<span class="_timestamp js-short-timestamp js-relative-timestamp" data-long-form="true" data-time="1376456495">5分</span>
</a>
</small>
</div>
<p class="js-tweet-text tweet-text">スタバは仕事しながら盗み聞きで定性的なマーケティングできるから好き。</p>
<div class="expanded-content js-tweet-details-dropdown"></div>
</div>
</div>
</li>
<li class="js-stream-item stream-item stream-item expanding-stream-item" data-item-id="367511235920539648" data-item-type="tweet" id="stream-item-tweet-367511235920539648">
<div class="tweet original-tweet js-stream-tweet js-actionable-tweet js-profile-popup-actionable js-original-tweet">
<span class="icon dogear"></span>
<div class="content">
<div class="stream-item-header">
<a class="account-group js-account-group js-action-profile js-user-profile-link js-nav" data-user-id="106364043" href="/andomifuyu">
<img alt="" class="avatar js-action-profile-avatar" src="https://si0.twimg.com/profile_images/2219740906/resize_Mifuyu-9_normal.png">
<strong class="fullname js-action-profile-name show-popup-with-id">安藤美冬</strong>
<span>&rlm;</span>
<span class="username js-action-profile-name">
<s>@</s>
<b>andomifuyu</b>
</span>
</a>
<small class="time">
<a class="tweet-timestamp js-permalink js-nav" href="/andomifuyu/status/367511235920539648" title="2013年8月13日 - 19:01">
<span class="_timestamp js-short-timestamp js-relative-timestamp" data-long-form="true" data-time="1376456481">5分</span>
</a>
</small>
</div>
<p class="js-tweet-text tweet-text">ワークフォリオ、現行のバージョンが再販決定！近日中に再開します。こちらが現行バージョンの販売最終回になりますので、お早めにー！</p>
<div class="expanded-content js-tweet-details-dropdown"></div>
</div>
</div>
</li>
<li class="js-stream-item stream-item stream-item expanding-stream-item" data-item-id="367405453535215616" data-item-type="tweet" id="stream-item-tweet-367405453535215616">
<div class="tweet original-tweet js-stream-tweet js-actionable-tweet js-profile-popup-actionable js-original-tweet promoted-tweet">
<span class="icon dogear"></span>
<div class="content">
<div class="stream-item-header">
<a class="account-group js-account-group js-action-profile js-user-profile-link js-nav" data-impression-cookie="[&amp;quot;549808548&amp;quot;,&amp;quot;3d9c2287a7797f5a&amp;quot;,&amp;quot;promoted&amp;quot;,&amp;quot;&amp;quot;,[109881204]]" data-user-id="549808548" href="/TravisBand">
<img alt="" class="avatar js-action-profile-avatar" src="https://si0.twimg.com/profile_images/3572570159/9269e8546f3a66cb0b3f81ad14565630_normal.jpeg">
<strong class="fullname js-action-profile-name show-popup-with-id">Travis</strong>
<span>&rlm;</span>
<span class="username js-action-profile-name">
<s>@</s>
<b>TravisBand</b>
</span>
</a>
<small class="time">
<a class="tweet-timestamp js-permalink js-nav" data-send-impression-cookie="" href="/TravisBand/status/367405453535215616" title="2013年8月13日 - 12:01">
<span class="_timestamp js-short-timestamp js-relative-timestamp" data-long-form="true" data-time="1376431260">7時間</span>
</a>
</small>
</div>
<p class="js-tweet-text tweet-text">
僕らトラヴィスのニュー・アルバム『ウェア・ユー・スタンド』が日本でリリー
スされました！アルバムの全曲試聴をやっているので、是非聴いて下さい。
<a class="twitter-timeline-link" data-expanded-url="http://bit.ly/1cecb4I" dir="ltr" href="http://t.co/rPbOX5CabO" rel="nofollow" target="_blank" title="http://bit.ly/1cecb4I">
<span class="tco-ellipsis"></span>
<span class="invisible">http://</span>
<span class="js-display-url">bit.ly/1cecb4I</span>
<span class="invisible"></span>
<span class="tco-ellipsis">
<span class="invisible">&nbsp;</span>
</span>
</a>
<a class="twitter-hashtag pretty-link js-nav" data-query-source="hashtag_click" dir="ltr" href="/search?q=%23whereyoustand&amp;amp;src=hash">
<s>#</s>
<b>whereyoustand</b>
</a>
</p>
<div class="expanded-content js-tweet-details-dropdown"></div>
</div>
</div>
</li>
<li class="js-stream-item stream-item stream-item expanding-stream-item" data-item-id="367511171705733121" data-item-type="tweet" id="stream-item-tweet-367511171705733121">
<div class="tweet original-tweet js-stream-tweet js-actionable-tweet js-profile-popup-actionable js-original-tweet" >
<span class="icon dogear"></span>
<div class="content">
<div class="stream-item-header">
<a class="account-group js-account-group js-action-profile js-user-profile-link js-nav" data-user-id="45500849" href="/umekida">
<img alt="" class="avatar js-action-profile-avatar" src="https://si0.twimg.com/profile_images/378800000170336725/4371faef908cc50a879e258a4efc921e_normal.png">
<strong class="fullname js-action-profile-name show-popup-with-id">Yuhei Umeki</strong>
<span>&rlm;</span>
<span class="username js-action-profile-name">
<s>@</s>
<b>umekida</b>
</span>
</a>
<small class="time">
<a class="tweet-timestamp js-permalink js-nav" href="/umekida/status/367511171705733121" title="2013年8月13日 - 19:01">
<span class="_timestamp js-short-timestamp js-relative-timestamp" data-long-form="true" data-time="1376456466">5分</span>
</a>
</small>
</div>
<p class="js-tweet-text tweet-text">広尾のスタバなうだが、隣のマダムたちが「ドンチッチョ」とか言っている。こういう客層か。</p>
<div class="expanded-content js-tweet-details-dropdown"></div>
</div>
</div>
</li>
<li class="js-stream-item stream-item stream-item expanding-stream-item" data-item-id="367511009411350528" data-item-type="tweet" id="stream-item-tweet-367511009411350528">
<div class="tweet original-tweet js-stream-tweet js-actionable-tweet js-profile-popup-actionable js-original-tweet has-cards has-native-media">
<span class="icon dogear"></span>
<div class="content">
<div class="stream-item-header">
<a class="account-group js-account-group js-action-profile js-user-profile-link js-nav" data-user-id="106364043" href="/andomifuyu">
<img alt="" class="avatar js-action-profile-avatar" src="https://si0.twimg.com/profile_images/2219740906/resize_Mifuyu-9_normal.png">
<strong class="fullname js-action-profile-name show-popup-with-id">安藤美冬</strong>
<span>&rlm;</span>
<span class="username js-action-profile-name">
<s>@</s>
<b>andomifuyu</b>
</span>
</a>
<small class="time">
<a class="tweet-timestamp js-permalink js-nav" href="/andomifuyu/status/367511009411350528" title="2013年8月13日 - 19:00">
<span class="_timestamp js-short-timestamp js-relative-timestamp" data-long-form="true" data-time="1376456427">6分</span>
</a>
</small>
</div>
<p class="js-tweet-text tweet-text">
わー！ありがとうございます。<a class="twitter-atreply pretty-link" dir="ltr" href="/kazumactor">
<s>@</s>
<b>kazumactor</b>
</a>:
<a class="twitter-atreply pretty-link" dir="ltr" href="/andomifuyu">
<s>@</s>
<b>andomifuyu</b>
</a>
今日、『ワークフォリオ』届きました！最高の色、質感です。使い倒します！！
<a class="twitter-timeline-link" data-pre-embedded="true" dir="ltr" href="http://t.co/L1JMKbIB87">pic.twitter.com/L1JMKbIB87</a>
</p>
<div class="expanded-content js-tweet-details-dropdown"></div>
</div>
</div>
</li>
</ol>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Raw
base.css
.btn {
position: relative;
display: inline-block;
padding: 5px 10px;
font-size: 13px;
font-weight: bold;
line-height: 18px;
color: #333;
text-shadow: 0 1px 1px rgba(255,255,255,.5);
background-color: #ccc;
background-repeat: no-repeat;
border: 1px solid #ccc;
cursor: pointer;
border-radius: 4px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.5);
box-shadow: 0 1px 0 rgba(255,255,255,.5);
}
.ie9 .btn { border-radius: 0 }
.no-shadow {
-webkit-box-shadow: none;
box-shadow: none;
}
.btn.no-shadow:active {
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1);
box-shadow: inset 0 2px 4px rgba(0,0,0,.1);
}
button.btn::-moz-focus-inner,
input[type=submit].btn::-moz-focus-inner {
padding: 0;
border: 0;
}
.btn {
background-color: #ddd;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#fff,#ddd);
background-image: -ms-linear-gradient(#fff,#ddd);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fff),color-stop(100%,#ddd));
background-image: -webkit-linear-gradient(#fff,#ddd);
background-image: -o-linear-gradient(#fff,#ddd);
background-image: linear-gradient(#fff,#ddd);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#dddddd');
}
.btn:hover,
.photo-selector:not(.disabled):hover .btn,
.follow-combo.open .btn-user-actions,
.dropdown.open .user-dropdown {
text-decoration: none;
background-color: #d8d8d8;
background-image: -moz-linear-gradient(#f8f8f8,#d8d8d8);
background-image: -ms-linear-gradient(#f8f8f8,#d8d8d8);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#f8f8f8),color-stop(100%,#d8d8d8));
background-image: -webkit-linear-gradient(#f8f8f8,#d8d8d8);
background-image: -o-linear-gradient(#f8f8f8,#d8d8d8);
background-image: linear-gradient(#f8f8f8,#d8d8d8);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
border-color: #bbb;
}
.btn.active,
.btn:active,
.follow-combo.open .btn-user-actions,
.dropdown.open .user-dropdown,
.btn.open,
.open>.btn {
border-color: #bbb;
background-image: none;
-webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1),0 1px 0 rgba(255,255,255,.5);
box-shadow: inset 0 2px 4px rgba(0,0,0,.1),0 1px 0 rgba(255,255,255,.5);
}
.btn.disabled,
.btn.disabled:hover,
.btn[disabled],
.btn[aria-disabled=true],
.primary-btn.btn.disabled,
.primary-btn.btn.disabled:hover,
.primary-btn.btn[disabled] {
color: #777;
text-shadow: 0 1px 1px rgba(255,255,255,.75);
cursor: default;
background-color: #ddd;
background-image: none;
border-color: #ccc;
filter: alpha(opacity=65);
opacity: .65;
}
.btn:focus { text-decoration: none }
a.btn:focus {
outline: dotted 1px #000;
outline: auto 5px -webkit-focus-ring-color;
}
.btn.large {
font-size: 16px;
line-height: 28px;
border-radius: 6px;
}
.btn.small {
padding-right: 9px;
padding-left: 9px;
font-size: 11px;
}
.signup-btn {
background-color: #fd9a0f;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#fee94f 0,#fd9a0f 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fee94f),color-stop(100%,#fd9a0f));
background-image: -webkit-linear-gradient(top,#fee94f 0,#fd9a0f 100%);
background-image: -ms-linear-gradient(top,#fee94f 0,#fd9a0f 100%);
background-image: -o-linear-gradient(top,#fee94f 0,#fd9a0f 100%);
background-image: linear-gradient(top,#fee94f 0,#fd9a0f 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fee94f',endColorstr='#fd9a0f',GradientType=0);
border-color: #fa2;
}
.signup-btn:hover,
.signup-btn:focus {
color: #333;
background-color: #fd9512;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#fedc4d 0,#fd9512 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fedc4d),color-stop(100%,#fd9512));
background-image: -webkit-linear-gradient(top,#fedc4d 0,#fd9512 100%);
background-image: -ms-linear-gradient(top,#fedc4d 0,#fd9512 100%);
background-image: -o-linear-gradient(top,#fedc4d 0,#fd9512 100%);
background-image: linear-gradient(top,#fedc4d 0,#fd9512 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fedc4d',endColorstr='#fd9512',GradientType=0);
border-color: #ec8b11;
}
.signup-btn:active {
background-image: none;
border-color: #ec8b11;
}
.primary-btn,
.following.first-hover .follow-btn:hover,
.following .follow-btn,
.following .follow-button.cancel-hover-style:hover,
.following .follow-button,
.email-following .email-follow-button.cancel-hover-style:hover,
.email-following .email-follow-button,
.email-follow-enabled .email-follow-state-button {
color: #fff;
text-shadow: 0 -1px 1px rgba(0,0,0,.25);
background-color: #019ad2;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#33bcef,#019ad2);
background-image: -ms-linear-gradient(#33bcef,#019ad2);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#33bcef),color-stop(100%,#019ad2));
background-image: -webkit-linear-gradient(#33bcef,#019ad2);
background-image: -o-linear-gradient(#33bcef,#019ad2);
background-image: linear-gradient(#33bcef,#019ad2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33bcef',endColorstr='#019ad2',GradientType=0);
border-color: #057ed0;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
}
.primary-btn:hover,
.primary-btn:focus {
color: #fff;
background-color: #0271bf;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#2daddc,#0271bf);
background-image: -ms-linear-gradient(#2daddc,#0271bf);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#2daddc),color-stop(100%,#0271bf));
background-image: -webkit-linear-gradient(#2daddc,#0271bf);
background-image: -o-linear-gradient(#2daddc,#0271bf);
background-image: linear-gradient(#2daddc,#0271bf);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2daddc',endColorstr='#0271bf',GradientType=0);
border-color: #096eb3;
}
.primary-btn:active {
background-image: none;
border-color: #096eb3;
}
.caution-btn,
.caution-btn:hover,
.following .follow-btn:hover,
.following .follow-button:hover,
.email-following .email-follow-button:hover,
.email-following .email-follow-state-button:hover,
.email-follow-enabled .email-follow-state-button:hover {
background-color: #c43c35;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#ee5f5b,#c43c35);
background-image: -ms-linear-gradient(#ee5f5b,#c43c35);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#ee5f5b),color-stop(100%,#c43c35));
background-image: -webkit-linear-gradient(#ee5f5b,#c43c35);
background-image: -o-linear-gradient(#ee5f5b,#c43c35);
background-image: linear-gradient(#ee5f5b,#c43c35);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b',endColorstr='#c43c35',GradientType=0);
border-color: #a93730;
border-bottom-color: #952f2a;
}
.caution-btn,
.caution-btn:focus {
color: #fff;
text-shadow: 0 -1px 1px rgba(0,0,0,.2);
}
.caution-btn:active,
.following:hover .follow-btn:active,
.following:hover .follow-button:active,
.email-following:hover .email-follow-button:active {
background-image: none;
border-color: #952f2a;
}
.fb-btn {
color: #fff;
background-color: #3c5d96;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#6079ab,#3c5d96);
background-image: -ms-linear-gradient(#6079ab,#3c5d96);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#6079ab),color-stop(100%,#3c5d96));
background-image: -webkit-linear-gradient(#6079ab,#3c5d96);
background-image: -o-linear-gradient(#6079ab,#3c5d96);
background-image: linear-gradient(#6079ab,#3c5d96);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6079ab',endColorstr='#3c5d96',GradientType=0);
border-color: #3c5a98;
border-bottom-color: #273b64;
text-align: left;
text-shadow: 0 -1px 1px rgba(0,0,0,.5);
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
}
.fb-btn:hover,
.fb-btn:focus {
background-color: #345285;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(#5e76a9,#344d7e);
background-image: -ms-linear-gradient(#5e76a9,#344d7e);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#5e76a9),color-stop(100%,#344d7e));
background-image: -webkit-linear-gradient(#5e76a9,#344d7e);
background-image: -o-linear-gradient(#5e76a9,#344d7e);
background-image: linear-gradient(#5e76a9,#344d7e);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5e76a9',endColorstr='#344d7e',GradientType=0);
border-color: #3c5a98;
border-bottom-color: #273b64;
}
.btn-group { position: relative }
.action-text {
min-width: 68px;
padding: 5px 7px;
padding-top: 4px\9;
padding-bottom: 4px\9;
}
.follow-btn {
padding: 0;
margin-right: 3px\9;
}
.btn-user-actions,
.user-dropdown,
.btn-search-actions {
padding-left: 7px;
padding-right: 7px;
}
.follow-btn .action-text { display: none }
.not-following .follow-btn .follow-text,
.following .follow-btn .following-text,
.following .follow-btn:hover .unfollow-text,
.following.first-hover .follow-btn:hover .following-text,
.blocked .follow-btn .block-text,
.blocked .follow-btn:hover .unblock-text,
.follow-request-sent .follow-btn .pending-text,
.follow-request-sent .follow-btn:hover .cancel-req-text { display: block }
.not-following.follow-request-sent .follow-btn .follow-text,
.following .follow-btn:hover .following-text,
.following.first-hover .follow-btn:hover .unfollow-text,
.blocked .follow-btn:hover .block-text,
.follow-request-sent .follow-btn:hover .pending-text { display: none }
.following .follow-btn,
.blocked .follow-btn,
.follow-request-sent .follow-btn { text-align: center }
.small-follow-all-wrapper .action-text,
.small-follow-all-wrapper .btn-user-actions { padding: 3px 4px }
.small-follow-all-wrapper .follow-btn .follow {
margin-top: 2px;
margin-left: 2px;
}
.follow-btn.small .follow {
margin-top: 1px;
margin-right: 4px;
}
.follow-btn.small-follow-btn {
margin-top: 3px;
margin-right: 9px;
}
.follow-btn.small-follow-btn .activity-follow { margin-top: -1px }
.small-follow-btn .action-text {
min-width: 0;
padding: 0;
}
.follow-combo .btn-group-dropdown .is-not-blocked,
.follow-combo.following .btn-group-dropdown .is-following,
.follow-combo.following .btn-group-dropdown .is-not-including,
.follow-combo.following .btn-group-dropdown .is-not-notifying,
.follow-combo.including .btn-group-dropdown .is-including,
.follow-combo.notifying .btn-group-dropdown .is-notifying,
.follow-combo.dismissable .btn-group-dropdown .is-dismissable,
.follow-combo .btn-group-dropdown .is-not-blocked.dropdown-divider,
.follow-combo.following .btn-group-dropdown .is-following.dropdown-divider,
.follow-combo.blocked .is-blocked,
.follow-combo.can-dm .can-send-dm { display: block }
.follow-combo .btn-group-dropdown li a,
.follow-combo .btn-group-dropdown .dropdown-divider,
.follow-combo.including .btn-group-dropdown .is-not-including,
.follow-combo.notifying .btn-group-dropdown .is-not-notifying,
.follow-combo.blocked .btn-group-dropdown .is-not-blocked,
.follow-combo .can-send-dm { display: none }
.btn-group-dropdown a s,
.user-actions .dropdown-menu .pretty-link s,
.user-actions .dropdown-menu .pretty-link:hover s { color: #777 }
.btn-group .dropdown-menu {
right: -1px;
border-width: 1px;
}
.mini-profile-footer .btn-group .dropdown-menu {
right: auto;
left: -1px;
}
.btn-group.open .btn-group-dropdown { display: block }
.btn-group .small .dropdown-menu {
top: 28px;
border-radius: 3px;
}
.user-actions { position: relative }
.user-actions .dropdown { display: inline-block }
.stream-item .follow-bar { float: right }
.email-follow-state-button .button-text,
.follow-button .button-text {
min-width: 70px;
padding: 5px 7px;
display: none;
text-align: center;
}
.email-follow-button .button-text {
min-width: 30px;
padding: 5px 7px;
display: none;
text-align: center;
}
.settings-stream .email-follow-button .button-text { min-width: 85px }
#extra-email-follow-settings .email-follow-state-button { float: right }
.follow-button,
.email-follow-button,
.email-follow-state-button {
padding: 0;
margin-right: 3px\9;
}
.following .follow-button .button-text,
.blocked .follow-button .button-text,
.pending .follow-button .button-text,
.settings-stream .email-follow-button .button-text { text-align: center }
.explanation .explanation-text,
.email-follow-button { display: none }
.profile-banner-footer .email-follow-button,
.settings-stream .email-follow-button,
.profile-stream .email-follow-button { display: inline-block }
.not-following .follow-button .follow-text,
.following .follow-button .following-text,
.following .follow-button:hover .unfollow-text,
.following .follow-button.cancel-hover-style:hover .following-text,
.blocked .follow-button .blocked-text,
.blocked .follow-button:hover .unblock-text,
.pending .follow-button .pending-text,
.pending .follow-button:hover .cancel-text,
.pending .follow-button.cancel-hover-style:hover .pending-text,
.email-follow-button .email-follow-text,
.email-following .email-follow-button .email-following-text,
.email-following .email-follow-button:hover .email-unfollow-text,
.email-following .email-follow-button.cancel-hover-style:hover .email-following-text,
.email-follow-disabled .email-follow-state-button .email-follow-text,
.email-follow-enabled .email-follow-state-button .email-following-text,
.email-follow-enabled .email-follow-state-button:hover .disable-email-follow-text,
.email-follow-disabled .explanation .email-follow-text,
.email-follow-enabled .explanation .email-following-text { display: block }
.pending .follow-button .follow-text,
.following .follow-button:hover .following-text,
.following .follow-button.cancel-hover-style:hover .unfollow-text,
.blocked .follow-button:hover .blocked-text,
.pending .follow-button:hover .pending-text,
.pending .follow-button.cancel-hover-style:hover .cancel-text,
.email-following .email-follow-button:hover .email-following-text,
.email-following .email-follow-button.cancel-hover-style:hover .email-unfollow-text,
.email-following .email-follow-button .email-follow-text,
.email-follow-enabled .email-follow-state-button:hover .email-following-text,
.blocked .email-follow-button,
.pending .email-follow-button,
.protected .email-follow-button { display: none }
.user-actions .dropdown-menu .dropdown-caret,
.user-actions .dropdown-menu .mention-text,
.user-actions .dropdown-menu .list-text,
.user-actions .dropdown-menu .block-text,
.user-actions .dropdown-menu .report-spam-text,
.user-actions .dropdown-menu .not-blocked,
.user-actions .dropdown-menu .not-blocked,
.user-actions .dropdown-menu .is-embeddable,
.user-actions .dropdown-menu .embed-profile,
.user-actions .dropdown-menu .email-follow,
.user-actions .dropdown-menu .email-follow-text,
.following .dropdown-menu .retweet-on-text,
.following .dropdown-menu .device-notifications-on-text,
.following .dropdown-menu .is-following,
.including .dropdown-menu .retweet-off-text,
.notifying .dropdown-menu .device-notifications-off-text,
.email-following .dropdown-menu .email-unfollow-text,
.dismissable .dropdown-menu .hide-suggestion-text,
.blocked .dropdown-menu .unblock-text,
.can-dm .dropdown-menu .dm-text { display: block }
.user-actions .dropdown-menu li,
.blocked .dropdown-menu .not-blocked,
.including .dropdown-menu .retweet-on-text,
.notifying .dropdown-menu .device-notifications-on-text,
.email-following .dropdown-menu .email-follow-text,
.blocked .dropdown-menu .mention-text,
.blocked .dropdown-menu .list-text,
.blocked .dropdown-menu .block-text,
.blocked .dropdown-menu .report-spam-text,
.protected .dropdown-menu .is-embeddable,
.protected .dropdown-menu .embed-profile { display: none }
.user-actions .dropdown-menu {
right: -1px;
border-width: 1px;
border-radius: 4px;
}
.user-actions .dropdown-menu span { font-size: 12px }
.mini-profile-footer .user-actions .dropdown-menu {
right: auto;
left: 0;
}
.user-actions .open .dropdown-menu { display: block }
.friend-actions .active-btn-text { display: block }
.friend-actions .pending-btn-text { display: none }
.friend-actions .pending .active-btn-text { display: none }
.friend-actions .pending .pending-btn-text { display: block }
.search-header .search-btn { top: 1px\9 }
.subscribe-btn>div { display: none }
.subscribe-btn.not-subscribed .subscribe-text,
.subscribe-btn.subscribed .remove-text { display: block }
.module.tweet-to-user { background-color: transparent }
.tweet-btn {
display: block;
text-align: center;
}
.large-tweet-btn {
padding: 7px 10px;
border: 0;
border-radius: 5px;
-webkit-box-shadow: none;
box-shadow: none;
}
.tweet-btn .tweet-new { margin: 0 6px -2px 0 }
.btn-link {
padding: 0;
background-color: transparent;
border: 0;
cursor: pointer;
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.btn-link:hover,
.btn-link:focus {
outline: 0;
text-decoration: underline;
-webkit-box-shadow: none;
box-shadow: none;
}
.user-actions .follow-link .link-text { display: none }
.user-actions.not-following .follow-link .follow-text { display: inline }
.user-actions.following .follow-link .unfollow-text { display: inline }
.user-actions.pending .follow-link .cancel-text { display: inline }
.feedback-btn { font-size: 12px }
body {
background-color: #fff;
color: #333;
font-size: 14px;
line-height: 18px;
margin: 0;
padding: 0;
}
body,
label,
input,
textarea,
select,
button { font-family: "Helvetica Neue",Arial,sans-serif }
body.ms-windows,
body.ms-windows label,
body.ms-windows input,
body.ms-windows textarea,
body.ms-windows select,
body.ms-windows button { font-family: Arial,sans-serif }
body.ar,
body.ur,
body.fa,
body.ar label,
body.ar input,
body.ar textarea,
body.ar select,
body.ar button,
body.fa label,
body.fa input,
body.fa textarea,
body.fa select,
body.fa button,
body.ur label,
body.ur input,
body.ur textarea,
body.ur select,
body.ur button { font-family: Tahoma,Arial,sans-serif }
body.ja,
body.ja label,
body.ja input,
body.ja textarea,
body.ja select,
body.ja button,
body.ja .bio {
font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic Pro",Meiryo,"MS PGothic",sans-serif;
font-style: normal;
}
a {
color: #0084b4;
text-decoration: none;
}
a:focus { outline: 0 }
a:hover,
a:focus { text-decoration: underline }
a.hide-focus { text-decoration: none }
h1,
h2,
h3,
h4,
h5,
h6 {
color: #333;
margin: 0;
text-rendering: optimizeLegibility;
}
h1 {
font-size: 24px;
font-weight: bold;
line-height: 1;
}
h2 {
font-size: 18px;
font-weight: bold;
line-height: 20px;
}
h2 small {
color: #999;
font-size: 12px;
font-weight: normal;
}
h3 {
font-size: 14px;
font-weight: normal;
line-height: 1;
}
h4 {
font-size: 12px;
line-height: 18px;
}
h5,
h6 { font-size: 10px }
p { margin: 0 }
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th { padding: 0 }
small { font-size: 12px }
.muted { color: #999 }
.important { color: #c00c0c }
.lead {
color: #999;
font-size: 16px;
font-weight: 200;
margin-bottom: 10px;
}
.fine-print {
color: #999;
font-size: 11px;
line-height: 15px;
}
.hidden { display: none }
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
ul,
ol {
margin: 0;
padding: 0;
}
ul { list-style: none }
ol {
list-style: decimal;
margin-left: 20px;
}
ol>li { line-height: 20px }
.inline-list { margin-left: 0 }
.inline-list li { display: inline }
button { margin: 0 }
img { border: 0 }
.clearfix:before,
.clearfix:after,
.control-group:before,
.control-group:after,
.stream-item>div:before,
.stream-item>div:after,
.module:after,
.module:before,
.follow-card header:after,
.follow-card header:before,
.follow-bar:after,
.follow-bar:before,
.search-header:after,
.search-header:before,
.tweet-form:after,
.tweet-form:before,
.modal-footer:after,
.modal-footer:before,
.local-trends-breadcrumb:after,
.local-trends-breadcrumb:before,
.input-prepend .add-on,
.input-append .add-on,
.wrapper:after,
.wrapper:before,
.expanded-content:before,
.expanded-content:after,
.stream-item:before,
.stream-item:after {
content: " ";
display: table;
}
.clearfix:after,
.control-group:after,
.stream-item>div:after,
.module:after,
.follow-card header:after,
.follow-bar:after,
.search-header:after,
.tweet-form:after,
.modal-footer:after,
.local-trends-breadcrumb:after,
.wrapper:after,
.expanded-content:after,
.stream-item:after { clear: both }
hr {
border: 0;
border-top: 1px solid #eee;
height: 0;
margin: 14px 0 0;
padding: 0;
}
.unselectable {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.ellipsify-container {
overflow: hidden;
position: relative;
}
.ellipsify-container .ellip-content {
display: inline-block;
overflow: hidden;
white-space: nowrap;
}
.ellipsify-container .ellip {
position: absolute;
right: 0;
top: 0;
}
.global-nav,
.global-nav .well,
.nav .active>a,
.btn-tweet,
.btn-tweet:hover,
.btn-tweet:active,
.nav .active>a,
.card-soccer .cover {
background-image: url(../img/twitter_web_sprite_bgs.png);
background-repeat: repeat-x;
}
.global-nav {
background-position: 0 0;
background-color: #252525;
}
.nav .active>a { background-position: 0 -50px }
.global-nav .well { background-position: 0 -100px }
.btn-tweet {
background-position: 0 -140px;
background-color: #2c77ba;
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.btn-tweet:hover,
.btn-tweet:focus { background-position: 0 -170px }
.btn-tweet:active { background-position: 0 -200px }
i,
.icon {
display: inline-block;
vertical-align: text-top;
background-image: url(../img/twitter_web_sprite_icons.png);
background-position: 0 0;
background-repeat: no-repeat;
}
.bird-etched {
width: 34px;
height: 26px;
}
.bird-topbar-etched,
.bird-topbar-blue,
.bird-topbar-white {
width: 24px;
height: 21px;
}
.bird-topbar-etched { background-position: -40px 0 }
.bird-topbar-blue { background-position: -80px 0 }
.bird-corpbar,
.bird-topbar-phx {
float: left;
padding: 7px 20px 9px;
}
.bird-corpbar:hover,
.bird-topbar-phx:hover { background-color: rgba(255,255,255,.1) }
.bird-topbar-white { background-position: -120px 0 }
.nav-home,
.nav-topics,
.nav-people,
.nav-me,
.nav-tweet { height: 22px }
.nav-home {
background-position: 0 -50px;
width: 21px;
}
.nav-topics {
background-position: -40px -50px;
width: 17px;
}
.nav-people {
background-position: -80px -50px;
width: 21px;
}
.nav-me {
background-position: -120px -50px;
width: 21px;
}
.nav-session {
background-position: -160px -50px;
width: 20px;
height: 21px;
}
.nav-tweet {
background-position: -200px -50px;
width: 22px;
height: 18px;
}
.topbar-divider {
background-position: -240px -50px;
width: 2px;
height: 32px;
}
.nav-breaker {
background-position: -260px -50px;
width: 18px;
height: 19px;
}
.nav-new {
background-position: -200px -80px;
width: 24px;
height: 3px;
}
.global-nav a:hover .nav-home,
.global-nav a:focus .nav-home { background-position: 0 -80px }
.global-nav a:hover .nav-topics,
.global-nav a:focus .nav-topics { background-position: -40px -80px }
.global-nav a:hover .nav-people,
.global-nav a:focus .nav-people { background-position: -80px -80px }
.global-nav a:hover .nav-me,
.global-nav a:focus .nav-me { background-position: -120px -80px }
.global-nav a:hover .nav-session,
.global-nav a:focus .nav-session,
.global-nav .open .nav-session { background-position: -160px -80px }
.global-nav a:hover .nav-breaker,
.global-nav a:focus .nav-breaker { background-position: -260px -80px }
.active .nav-home,
.active a:hover .nav-home,
.active a:focus .nav-home { background-position: 0 -110px }
.active .nav-topics,
.active a:hover .nav-topics,
.active a:focus .nav-topics { background-position: -40px -110px }
.active .nav-people,
.active a:hover .nav-people,
.active a:focus .nav-people { background-position: -80px -110px }
.active .nav-me,
.active a:hover .nav-me,
.active a:focus .nav-me { background-position: -120px -110px }
.active .nav-session,
.active a:hover .nav-session,
.active a:focus .nav-session { background-position: -160px -110px }
.chev-right,
.chev-left {
background-position: 0 -140px;
width: 9px;
height: 13px;
}
.chev-left {
-o-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.list-link:hover .chev-right,
.list-link:focus .chev-right,
.active .chev-right,
.list-link:hover .chev-left,
.list-link:focus .chev-left,
.active .chev-left { background-position: 0 -160px }
.sm-reply,
.sm-rt,
.sm-fav,
.sm-image,
.sm-video,
.sm-audio,
.sm-geo,
.sm-in,
.sm-lock,
.sm-trash,
.sm-page,
.sm-embed,
.sm-summary,
.sm-chat,
.sm-bird,
.sm-top-tweet,
.sm-more {
height: 13px;
background-color: #999;
}
.tweet:hover .sm-reply,
.simple-tweet.opened-tweet.focus .sm-reply,
.simple-tweet .sm-reply,
.simple-tweet.opened-tweet:hover .sm-reply { background-position: 0 -220px }
.tweet:hover .sm-rt,
.simple-tweet.opened-tweet.focus .sm-rt,
.simple-tweet .sm-rt,
.simple-tweet.opened-tweet:hover .sm-rt { background-position: -20px -220px }
.tweet:hover .sm-fav,
.simple-tweet.opened-tweet.focus .sm-fav,
.simple-tweet .sm-fav,
.simple-tweet.opened-tweet:hover .sm-fav { background-position: -40px -220px }
.tweet:hover .sm-image,
.simple-tweet.opened-tweet.focus .sm-image,
.simple-tweet .sm-image,
.simple-tweet.opened-tweet:hover .sm-image { background-position: -60px -220px }
.tweet:hover .sm-video,
.simple-tweet.opened-tweet.focus .sm-video,
.simple-tweet .sm-video,
.simple-tweet.opened-tweet:hover .sm-video { background-position: -80px -220px }
.tweet:hover .sm-audio,
.simple-tweet.opened-tweet.focus .sm-audio,
.simple-tweet .sm-audio,
.simple-tweet.opened-tweet:hover .sm-audio { background-position: -100px -220px }
.tweet:hover .sm-geo,
.simple-tweet.opened-tweet.focus .sm-geo,
.simple-tweet .sm-geo,
.simple-tweet.opened-tweet:hover .sm-geo { background-position: -120px -220px }
.tweet:hover .sm-lock,
.simple-tweet.opened-tweet.focus .sm-lock,
.simple-tweet .sm-lock,
.simple-tweet.opened-tweet:hover .sm-lock { background-position: -140px -220px }
.tweet:hover .sm-trash,
.simple-tweet.opened-tweet.focus .sm-trash,
.simple-tweet .sm-trash,
.simple-tweet.opened-tweet:hover .sm-trash { background-position: -160px -220px }
.tweet:hover .sm-embed,
.simple-tweet.opened-tweet.focus .sm-embed,
.simple-tweet .sm-embed,
.simple-tweet.opened-tweet:hover .sm-embed,
.tweet:hover .sm-summary,
.simple-tweet.opened-tweet.focus .sm-summary,
.simple-tweet .sm-summary,
.simple-tweet.opened-tweet:hover .sm-summary { background-position: -180px -220px }
.tweet:hover .sm-chat,
.simple-tweet.opened-tweet.focus .sm-chat,
.simple-tweet .sm-chat,
.simple-tweet.opened-tweet:hover .sm-chat { background-position: -200px -220px }
.sm-bird { background-position: -220px -220px }
.sm-top-tweet { background-position: -240px -220px }
.sm-details { background-position: -260px -220px }
.tweet:hover .sm-translate,
.simple-tweet.opened-tweet.focus .sm-translate,
.simple-tweet .sm-translate,
.simple-tweet.opened-tweet:hover .sm-translate { background-position: -280px -220px }
.tweet:hover .sm-more,
.simple-tweet.opened-tweet.focus .sm-more,
.simple-tweet .sm-more,
.simple-tweet.opened-tweet.focus .sm-more,
.simple-tweet.opened-tweet:hover .sm-more { background-position: -280px -220px }
.sm-reply,
.opened-tweet:hover .sm-reply,
.open .conversation-tweet-item .simple-tweet:hover .sm-reply,
.opened-tweet.focus .sm-reply,
.stream-item-activity .original-tweet:hover .sm-reply {
background-position: 0 -190px;
width: 12px;
}
.sm-rt,
.opened-tweet:hover .sm-rt,
.open .conversation-tweet-item .simple-tweet:hover .sm-rt,
.opened-tweet.focus .sm-rt,
.stream-item-activity .original-tweet:hover .sm-rt {
background-position: -20px -190px;
width: 14px;
}
.sm-fav,
.opened-tweet:hover .sm-fav,
.open .conversation-tweet-item .simple-tweet:hover .sm-fav,
.opened-tweet.focus .sm-fav,
.stream-item-activity .original-tweet:hover .sm-fav {
background-position: -40px -190px;
width: 10px;
}
.sm-image,
.opened-tweet:hover .sm-image,
.open .conversation-tweet-item .simple-tweet:hover .sm-image,
.opened-tweet.focus .sm-image,
.stream-item-activity .original-tweet:hover .sm-image {
background-position: -60px -190px;
width: 12px;
}
.sm-video,
.opened-tweet:hover .sm-video,
.open .conversation-tweet-item .simple-tweet:hover .sm-video,
.opened-tweet.focus .sm-video,
.stream-item-activity .original-tweet:hover .sm-video {
background-position: -80px -190px;
width: 12px;
}
.sm-audio,
.opened-tweet:hover .sm-audio,
.open .conversation-tweet-item .simple-tweet:hover .sm-audio,
.opened-tweet.focus .sm-audio,
.stream-item-activity .original-tweet:hover .sm-audio {
background-position: -100px -190px;
width: 9px;
}
.sm-geo,
.opened-tweet:hover .sm-geo,
.open .conversation-tweet-item .simple-tweet:hover .sm-geo,
.opened-tweet.focus .sm-geo,
.stream-item-activity .original-tweet:hover .sm-geo {
background-position: -120px -190px;
width: 9px;
}
.sm-lock,
.opened-tweet:hover .sm-lock,
.open .conversation-tweet-item .simple-tweet:hover .sm-lock,
.opened-tweet.focus .sm-lock,
.stream-item-activity .original-tweet:hover .sm-lock {
background-position: -140px -190px;
width: 8px;
}
.sm-trash,
.opened-tweet:hover .sm-trash,
.open .conversation-tweet-item .simple-tweet:hover .sm-trash,
.opened-tweet.focus .sm-trash,
.stream-item-activity .original-tweet:hover .sm-trash {
background-position: -160px -190px;
width: 9px;
}
.sm-embed,
.opened-tweet:hover .sm-embed,
.open .conversation-tweet-item .simple-tweet:hover .sm-embed,
.opened-tweet.focus .sm-embed,
.stream-item-activity .original-tweet:hover .sm-embed,
.opened-tweet:hover .sm-summary,
.open .conversation-tweet-item .simple-tweet:hover .sm-summary,
.opened-tweet.focus .sm-summary,
.stream-item-activity .original-tweet:hover .sm-summary,
.sm-summary {
background-position: -180px -190px;
width: 9px;
}
.sm-chat,
.opened-tweet:hover .sm-chat,
.open .conversation-tweet-item .simple-tweet:hover .sm-chat,
.stream-item-activity .original-tweet:hover .sm-chat {
background-position: -200px -190px;
width: 10px;
}
.sm-bird {
background-position: -220px -190px;
width: 14px;
}
.sm-top-tweet {
background-position: -240px -190px;
width: 11px;
}
.sm-details {
background-position: -260px -190px;
width: 11px;
}
.sm-translate,
.opened-tweet:hover .sm-translate,
.open .conversation-tweet-item .simple-tweet:hover .sm-translate,
.stream-item-activity .original-tweet:hover .sm-translate {
background-position: -280px -190px;
width: 11px;
}
.sm-more,
.opened-tweet:hover .sm-more,
.open .conversation-tweet-item .simple-tweet:hover .sm-more,
.opened-tweet.focus .sm-more,
.stream-item-activity .tweet:hover .sm-more {
background-position: -280px -190px;
width: 15px;
}
.sm-mentions,
.sm-messages,
.sm-list,
.sm-network,
.sm-story {
width: 16px;
height: 15px;
background-color: #2c77ba;
}
.sm-mentions { background-position: -58px -1158px }
.sm-messages { background-position: -88px -1158px }
.sm-list { background-position: -118px -1158px }
.sm-network { background-position: -148px -1158px }
.sm-story { background-position: -178px -1158px }
.list-link:hover .sm-mentions { background-position: -58px -1128px }
.list-link:hover .sm-messages { background-position: -88px -1128px }
.list-link:hover .sm-list { background-position: -118px -1128px }
.list-link:hover .sm-network { background-position: -148px -1128px }
.list-link:hover .sm-story { background-position: -178px -1128px }
.tweet-inverted .sm-reply,
.tweet-inverted.focus .sm-reply,
.tweet-inverted:hover .sm-reply { background-position: 0 -250px }
.tweet-inverted .sm-rt,
.tweet-inverted.focus .sm-rt,
.tweet-inverted:hover .sm-rt { background-position: -20px -250px }
.tweet-inverted .sm-fav,
.tweet-inverted.focus .sm-fav,
.tweet-inverted:hover .sm-fav { background-position: -40px -250px }
.tweet-inverted .sm-image,
.tweet-inverted.focus .sm-image,
.tweet-inverted:hover .sm-image { background-position: -60px -250px }
.tweet-inverted .sm-video,
.tweet-inverted.focus .sm-video,
.tweet-inverted:hover .sm-video { background-position: -80px -250px }
.tweet-inverted .sm-audio,
.tweet-inverted.focus .sm-audio,
.tweet-inverted:hover .sm-audio { background-position: -100px -250px }
.tweet-inverted .sm-geo,
.tweet-inverted.focus .sm-geo,
.tweet-inverted:hover .sm-geo { background-position: -120px -250px }
.tweet-inverted .sm-in,
.tweet-inverted.focus .sm-in,
.tweet-inverted:hover .sm-in { background-position: -140px -250px }
.tweet-inverted .sm-lock,
.tweet-inverted.focus .sm-lock,
.tweet-inverted:hover .sm-lock { background-position: -160px -250px }
.tweet-inverted .sm-trash,
.tweet-inverted.focus .sm-trash,
.tweet-inverted:hover .sm-trash { background-position: -160px -250px }
.tweet-inverted .sm-page,
.tweet-inverted.focus .sm-page,
.tweet-inverted:hover .sm-page { background-position: -200px -250px }
.tweet-inverted .sm-embed,
.tweet-inverted.focus .sm-embed,
.tweet-inverted:hover .sm-embed { background-position: -240px -250px }
.tweet-inverted .sm-chat,
.tweet-inverted.focus .sm-chat,
.tweet-inverted:hover .sm-chat { background-position: -100px -250px }
.tweet-inverted .sm-bird,
.tweet-inverted.focus .sm-bird,
.tweet-inverted:hover .sm-bird { background-position: -100px -250px }
.tweet-inverted .sm-top-tweet,
.tweet-inverted.focus .sm-top-tweet,
.tweet-inverted:hover .sm-top-tweet { background-position: -100px -250px }
.tweet-inverted.focus .sm-more,
.tweet-inverted:hover .sm-more { background-position: -280px -250px }
.permalink-tweet .sm-reply,
.permalink-tweet .sm-rt,
.permalink-tweet .sm-fav,
.permalink-tweet .sm-trash,
.permalink-tweet .sm-more,
.permalink-tweet .sm-translate {
height: 16px;
margin-top: -2px;
}
.permalink-tweet .sm-reply,
.permalink-tweet:hover .sm-reply,
.permalink-tweet.focus .sm-reply {
background-position: 0 -280px;
width: 18px;
}
.permalink-tweet .sm-rt,
.permalink-tweet:hover .sm-rt,
.permalink-tweet.focus .sm-rt {
background-position: -30px -280px;
width: 22px;
}
.permalink-tweet .sm-fav,
.permalink-tweet:hover .sm-fav,
.permalink-tweet.focus .sm-fav {
background-position: -60px -280px;
width: 16px;
}
.permalink-tweet .sm-trash,
.permalink-tweet:hover .sm-trash,
.permalink-tweet.focus .sm-trash {
background-position: -90px -280px;
width: 11px;
}
.permalink-tweet .sm-translate,
.permalink-tweet:hover .sm-translate,
.permalink-tweet.focus .sm-translate {
background-position: -120px -280px;
width: 15px;
}
.permalink-tweet .sm-more,
.permalink-tweet:hover .sm-more,
.permalink-tweet.focus .sm-more {
background-position: -180px -280px;
width: 22px;
}
.badge-promoted,
.badge-top,
.badge-political,
.badge-favorited,
.badge-tweet-alert,
.badge-retweeted {
width: 16px;
height: 12px;
background-color: transparent;
vertical-align: -1px;
*vertical-align: middle;
}
.badge-promoted { background-position: 0 -350px }
.badge-political { background-position: -20px -350px }
.badge-top { background-position: -40px -350px }
.badge-retweeted { background-position: -60px -350px }
.badge-favorited { background-position: -80px -350px }
.badge-tweet-alert { background-position: -120px -350px }
.play-large {
background-position: 0 -370px;
width: 48px;
height: 48px;
}
.play-medium {
background-position: -60px -370px;
width: 32px;
height: 32px;
}
.play {
background-position: -100px -370px;
width: 21px;
height: 21px;
}
.follow,
.follow-white { margin-top: 2px }
.account-arrow,
.search-toggle { margin-top: 1px }
.follow {
background-position: 0 -430px;
width: 18px;
height: 14px;
}
.follow-white {
background-position: -195px -430px;
width: 18px;
height: 14px;
}
.block {
background-position: -30px -430px;
width: 14px;
height: 14px;
}
.account-arrow {
background-position: -60px -430px;
width: 22px;
height: 12px;
}
.search-toggle {
background-position: -90px -430px;
width: 23px;
height: 14px;
}
.dm-envelope {
background-position: -120px -430px;
width: 20px;
height: 14px;
}
.dm-mark-all-read {
background-position: -167px -509px;
width: 22px;
height: 16px;
}
.dogear {
position: absolute;
top: 0;
right: 0;
display: none;
width: 24px;
height: 24px;
}
.retweeted .dogear { background-position: 0 -450px }
.favorited .dogear { background-position: -30px -450px }
.retweeted.favorited .dogear { background-position: -60px -450px }
.retweeted .dogear,
.favorited .dogear,
.retweeted.favorited .dogear { display: block }
.verified-large,
.translator-large {
width: 22px;
height: 22px;
}
.verified,
.translator {
width: 15px;
height: 15px;
margin: -1px 3px 0 2px;
}
.verified-large { background-position: 0 -480px }
.verified { background-position: -30px -480px }
.translator-large { background-position: -60px -480px }
.translator { background-position: -90px -480px }
.verified-large-border,
.translator-large-border {
width: 21px;
height: 21px;
}
.verified-large-border { background-position: -120px -480px }
.translator-large-border { background-position: -160px -480px }
.lock-large {
background-position: -200px -480px;
width: 15px;
height: 18px;
}
.close-large {
background-position: 0 -510px;
width: 12px;
height: 13px;
}
.close {
background-position: -20px -510px;
width: 9px;
height: 9px;
}
.dismiss:hover .close { background-position: -40px -510px }
.close-medium,
.error-x,
.dismiss-white {
width: 10px;
height: 12px;
}
.close-medium { background-position: -60px -510px }
.modal-close:hover .close-medium { background-position: -80px -510px }
.error-x { background-position: -100px -510px }
.dismiss-white { background-position: -120px -510px }
.tweet-hash,
.tweet-at,
.tweet-camera,
.tweet-geo { height: 17px }
.tweet-hash {
background-position: 0 -530px;
width: 16px;
}
.tweet-at {
background-position: -30px -530px;
width: 16px;
}
.tweet-camera {
background-position: -60px -530px;
width: 20px;
}
.tweet-geo {
background-position: -90px -530px;
width: 11px;
}
.active .tweet-hash { background-position: 0 -590px }
.active .tweet-at { background-position: -30px -590px }
.active .tweet-camera { background-position: -60px -590px }
.active .tweet-geo { background-position: -90px -590px }
.unread {
background-position: 0 -620px;
width: 13px;
height: 12px;
}
.replied {
background-position: -20px -620px;
width: 13px;
height: 10px;
}
.service-gmail,
.service-gmail2,
.service-yahoo,
.service-hotmail,
.service-aol,
.service-linkedin,
.service-msn,
.service-msn2,
.service-daum,
.service-yahoojapan,
.service-yandex {
width: 24px;
height: 24px;
}
.service-gmail,
.service-gmail2 { background-position: 0 -640px }
.service-yahoo { background-position: -30px -640px }
.service-hotmail { background-position: -60px -640px }
.service-msn2 { background-position: -60px -640px }
.service-aol { background-position: -90px -640px }
.service-linkedin { background-position: -120px -640px }
.service-msn { background-position: -150px -640px }
.service-daum { background-position: -180px -640px }
.service-yahoojapan { background-position: -210px -640px }
.service-yandex { background-position: -240px -640px }
.service-sm-gmail2,
.service-sm-yahoo,
.service-sm-hotmail,
.service-sm-aol,
.service-sm-linkedin,
.service-sm-facebook,
.service-sm-msn,
.service-sm-daum { height: 16px }
.service-sm-gmail,
.service-sm-gmail2 {
background-position: 0 -670px;
width: 16px;
}
.service-sm-yahoo {
background-position: -30px -670px;
width: 20px;
}
.service-sm-hotmail {
background-position: -60px -670px;
width: 16px;
}
.service-sm-aol {
background-position: -90px -670px;
width: 16px;
}
.service-sm-linkedin {
background-position: -120px -670px;
width: 15px;
}
.service-sm-facebook {
background-position: -150px -670px;
width: 14px;
}
.service-sm-msn {
background-position: -180px -670px;
width: 16px;
}
.service-sm-daum {
background-position: -210px -670px;
width: 14px;
}
.service-sm-yandex {
background-position: -230px -670px;
width: 16px;
}
.service-sm-native-photobucket {
background-position: -270px -670px;
width: 16px;
height: 14px;
*margin-right: 3px;
}
.checkmark,
.dropdown-check {
width: 10px;
height: 12px;
}
.checkmark { background-position: 0 -690px }
.dropdown-check { background-position: -20px -690px }
.geo-focused .checkmark,
a:hover .dropdown-check,
.dropdown-link:hover .dropdown-check,
.selected .dropdown-check { background-position: -40px -690px }
.nav-search,
.generic-search {
width: 12px;
height: 14px;
}
.nav-search { background-position: -20px -710px }
.generic-search { background-position: -40px -710px }
a:hover .generic-search,
.selected .generic-search { background-position: -60px -710px }
.geo-search {
background-position: 0 -710px;
width: 12px;
height: 14px;
}
.geo-check {
background-position: 0 -690px;
width: 15px;
height: 14px;
}
.geo-turn-off {
background-position: -60px -510px;
width: 10px;
height: 12px;
}
.watermark-lock {
background-position: 0 -730px;
width: 75px;
height: 85px;
}
.activity-follow,
.activity-fav,
.activity-list,
.activity-rt,
.activity-reply {
height: 14px;
width: 14px;
}
.activity-follow { background-position: 0 -820px }
.activity-fav { background-position: -20px -820px }
.activity-list { background-position: -40px -820px }
.activity-rt { background-position: -60px -820px }
.embed-align-none { background-position: 0 -840px }
.embed-align-left { background-position: -22px -840px }
.embed-align-right { background-position: -42px -840px }
.embed-align-center { background-position: -63px -840px }
.active .embed-align-none { background-position: 0 -860px }
.active .embed-align-left { background-position: -22px -860px }
.active .embed-align-right { background-position: -42px -860px }
.active .embed-align-center { background-position: -63px -860px }
.trash {
background-position: 0 -880px;
width: 11px;
height: 14px;
}
a:hover .trash { background-position: -20px -880px }
.disco-media-type {
width: 14px;
height: 13px;
}
.story.image .disco-media-type { background-position: 0 -900px }
.story.video .disco-media-type { background-position: -20px -900px }
.image-gray {
background-position: -40px -900px;
width: 15px;
height: 12px;
}
.image-gray-large {
background-position: -60px -900px;
width: 19px;
height: 16px;
}
.sm-search {
background-position: 0 -930px;
width: 12px;
height: 14px;
}
.stork-pip-up,
.stork-pip-down,
.stork-pip-left,
.stork-pip-right {
width: 60px;
height: 50px;
}
.stork-pip-right { background-position: 0 -970px }
.stork-pip-left { background-position: -60px -970px }
.stork-pip-up {
background-position: -90px -970px;
height: 60px;
}
.stork-pip-down {
background-position: -120px -970px;
height: 60px;
}
.stork-pip-right:hover { background-position: 0 -1030px }
.contrast-flex-module .pointer {
background-position: -240px -970px;
width: 25px;
height: 30px;
}
.stork-open-tweet { background-position: 0 -900px }
.stork-help {
background-position: -280px -970px;
height: 20px;
}
.icon-nav-tweets,
.icon-nav-people,
.icon-nav-lists,
.icon-nav-favorites {
background-color: #ccc;
height: 17px;
}
.icon-nav-tweets {
background-position: 0 -1100px;
width: 16px;
}
.icon-nav-people {
background-position: -30px -1100px;
width: 22px;
}
.icon-nav-lists {
background-position: -60px -1100px;
width: 18px;
}
.icon-nav-favorites {
background-position: -90px -1100px;
width: 16px;
}
.stream-autoplay-marker .arrow { background-position: -120px -1187px }
.autoplay-control .autoplay-play { background-position: -60px -1190px }
.autoplay-control .autoplay-play:hover { background-position: -90px -1190px }
.autoplay-control .autoplay-pause { background-position: 0 -1190px }
.autoplay-control .autoplay-pause:hover { background-position: -30px -1190px }
.search-header .autoplay-control {
padding-left: 0;
float: left;
margin-right: 5px;
margin-left: 0;
}
.search-header .autoplay-control .play-pause {
width: 20px;
height: 17px;
}
.search-header .autoplay-control .autoplay-pause,
.search-header .autoplay-control .autoplay-play:hover { background-position: -54px -1289px }
.search-header .autoplay-control .autoplay-play,
.search-header .autoplay-control .autoplay-pause:hover { background-position: -28px -1289px }
.autoplay-control+.search-title { width: inherit }
.with-icn {
font-size: 12px;
color: #999;
}
.with-icn i { margin-right: 1px }
.with-icn b {
font-weight: normal;
color: inherit;
}
.with-icn:hover,
.with-icn:focus { text-decoration: none }
.with-icn:hover b,
.with-icn:focus b { text-decoration: underline }
.configurator-user,
.configurator-search,
.configurator-list,
.configurator-favorites {
margin: -3px 10px 0 0;
width: 24px;
height: 22px;
}
.configurator-user { background-position: 0 -1220px }
.configurator-search { background-position: -97px -1220px }
.configurator-list { background-position: -31px -1220px }
.configurator-favorites { background-position: -63px -1220px }
.add-photo-icon,
.inline-photo-drop-icon,
.add-photo-white,
.add-photo-white-transparent,
.add-photo-blue,
.add-photo-blue-transparent,
.add-photo-gray,
.add-photo-white-shadow,
.add-photo-white-shadow-transparent {
width: 27px;
height: 21px;
}
.add-photo-icon { background-position: -139px -1260px }
.add-photo-white { background-position: 1px -1260px }
.add-photo-white-transparent { background-position: -34px -1260px }
.add-photo-blue { background-position: -69px -1260px }
.add-photo-blue-transparent { background-position: -104px -1260px }
.add-photo-gray { background-position: -139px -1260px }
.add-photo-white-shadow { background-position: -174px -1260px }
.add-photo-white-shadow-transparent { background-position: -209px -1260px }
.email_follow_icons {
display: inline-block;
vertical-align: text-top;
background-image: url(https://ea.twimg.com/email/t1/toe_sprite_icons.png);
background-position: 0 0;
background-repeat: no-repeat;
width: 18px;
height: 14px;
}
.email_follow_icons.envelope {
margin-top: 1px;
margin-left: 3px;
}
.email_follow_icons.envelope.dark { background-position: -26px 0 }
.dropdown { position: relative }
.dropdown.center {
float: right;
right: 50%;
}
.dropdown.center .dropdown-menu {
float: right;
right: -50%;
position: relative;
}
.caret {
display: inline-block;
width: 0;
height: 0;
margin-top: 5px;
margin-left: 2px;
vertical-align: top;
border-top: 4px solid #777;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
}
.btn .caret { margin-top: 8px }
.open.dropdown .caret,
.dropdown-toggle:hover .caret,
.dropdown-toggle:focus .caret { border-top-color: #fff }
.open.dropdown .btn .caret { border-top-color: #333 }
.dropdown-menu {
position: absolute;
top: 100%;
z-index: 900;
display: none;
float: left;
padding: 4px 0;
margin: 2px 0 0;
background-color: #fff;
border-color: #999;
border-color: rgba(0,0,0,.2);
border-style: solid;
border-width: 1px;
border-radius: 4px;
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
box-shadow: 0 5px 10px rgba(0,0,0,.2);
background-clip: padding-box;
}
.dropdown-menu li {
display: block;
float: none;
line-height: 0\9;
line-height: inherit;
}
.dropdown-divider {
padding-top: 1px;
margin: 5px 1px 6px;
border-bottom: 1px solid #ddd;
}
.dropdown-menu .label {
padding: 4px 22px 0;
font-size: 12px;
color: #999;
white-space: nowrap;
}
.lt-ie10 .dropdown-menu .label { line-height: 18px }
.dropdown-menu li>a,
.dropdown-menu .dropdown-link {
position: relative;
display: block;
float: none;
clear: both;
padding: 3px 15px 3px 22px;
font-size: 12px;
font-weight: normal;
line-height: 18px;
color: #333;
text-shadow: none;
white-space: nowrap;
cursor: pointer;
}
.dropdown.center .dropdown-menu li>a,
.dropdown.center .dropdown-menu .dropdown-link {
padding: 3px 22px;
text-align: center;
}
.dropdown-menu li>a:focus .account-group b { text-decoration: none }
.dropdown-menu li>a:hover,
.dropdown-menu li>a:focus,
.dropdown-menu .dropdown-link:hover,
.dropdown-menu .dropdown-link:focus,
.dropdown-menu .typeahead-recent-search-item.selected,
.dropdown-menu .selected a,
.dropdown-menu .dropdown-link.selected {
color: #fff;
background-color: #2271a9;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#2f7eb6 0,#2271a9 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#2f7eb6),color-stop(100%,#2271a9));
background-image: -webkit-linear-gradient(top,#2f7eb6 0,#2271a9 100%);
background-image: -ms-linear-gradient(top,#2f7eb6 0,#2271a9 100%);
background-image: -o-linear-gradient(top,#2f7eb6 0,#2271a9 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2f7eb6',endColorstr='#2271a9',GradientType=0);
background-image: linear-gradient(top,#2f7eb6 0,#2271a9 100%);
text-decoration: none;
}
.dropdown-menu li>a s,
.dropdown-menu .dropdown-link s { color: #777 }
.dropdown-menu li>a:hover s,
.dropdown-menu li>a:focus s,
.dropdown-menu .selected>a s,
.dropdown-menu .dropdown-link:hover s,
.dropdown-menu .dropdown-link:focus s { color: #fff }
.dropdown-check {
position: absolute;
top: 5px;
left: 7px;
}
.dropdown-menu li button:focus { outline: 0 }
.dropdown-menu .dropdown-caret {
position: absolute;
top: -7px;
left: 12px;
width: 12px;
height: 7px;
float: left;
overflow: hidden;
}
.dropdown-caret.right {
left: auto;
right: 10px;
}
.dropdown-caret.center {
left: 50%;
margin-left: -6px;
}
.dropdown-caret .caret-outer,
.dropdown-caret .caret-inner {
position: absolute;
top: 0;
left: 0;
display: inline-block;
margin-left: -1px;
}
.dropdown-caret .caret-outer {
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #aaa;
border-bottom-color: rgba(0,0,0,.2);
}
.dropdown-caret .caret-inner {
top: 1px;
left: 1px;
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #fff;
}
.dropdown.open .dropdown-menu { display: block }
.session .dropdown-menu .dropdown-caret {
left: auto;
right: 27px;
}
.onebox .follow-combo .dropdown-caret,
.stream-item .account .btn-group .dropdown-caret,
.permalink-tweet .btn-group .dropdown-caret {
left: auto;
right: 13px;
}
.launchpad.dropdown li.dropdown-link {
background-color: #EEE;
color: #000;
text-shadow: 1px 1px 1px #FFF;
border-bottom: 1px solid #DDD;
border-top: 1px solid #f9f9f9;
font-weight: bold;
}
.launchpad.dropdown li.dropdown-link:hover {
background-color: #29abed;
color: #FFF;
text-shadow: 1px 1px 1px rgba(0,132,180,.75);
border-bottom: 1px solid #0084b4;
border-top: 1px solid #0e92c8;
background-image: none;
filter: none;
z-index: 2;
}
.launchpad.dropdown .dropdown-menu {
background-color: transparent;
padding: 0;
}
.launchpad.dropdown .dropdown-caret {
border-bottom: 1px solid #EEE;
z-index: 1;
}
.launchpad.dropdown .dropdown-caret .caret-inner { border-bottom-color: #EEE }
.launchpad.dropdown .dropdown-caret.hover {
border-bottom-color: #29abed;
z-index: 3;
}
.launchpad.dropdown .dropdown-caret.hover .caret-inner { border-bottom-color: #29abed }
.dropdown-menu .dropdown-link.hidden { display: none }
.launchpad.dropdown li:first-child+li {
padding-top: 4px;
border-radius: 4px 4px 0 0;
}
.launchpad.dropdown li:last-child {
padding-bottom: 4px;
border-radius: 0 0 4px 4px;
}
.dropdown-menu .dropdown-account {
font-size: 14px;
line-height: 24px;
overflow: hidden;
text-overflow: ellipsis;
cursor: pointer;
}
.dropdown-account .avatar {
float: left;
margin-right: 5px;
}
.dropdown-account .pretty-link s { color: #ccc }
.dropdown-account .pretty-link:hover b { text-decoration: none }
.dropdown-account .username { color: #999 }
.dropdown-account strong.fullname {
display: inline;
font-size: 12px;
}
.dropdown-account:hover .fullname,
.dropdown-account:hover .username,
.dropdown-account:hover .pretty-link s,
.dropdown-menu .account-summary:focus .fullname,
.dropdown-menu .account-summary:focus .metadata,
.dropdown-account.selected .fullname,
.dropdown-account.selected .username,
.dropdown-account.selected .pretty-link s { color: #fff }
.more-tweet-actions .dropdown-menu li>a { margin-left: 0 }
.more-tweet-actions .action-more-container,
.more-tweet-actions .action-more-container .dropdown { display: inline-block }
.more-tweet-actions .dropdown .dropdown-menu { margin: 0 }
.more-tweet-actions .dropdown .dropdown-menu .dropdown-caret { left: 9px }
.permalink-tweet .more-tweet-actions .dropdown .dropdown-menu .dropdown-caret { left: 12px }
body { overflow-y: scroll }
html,
body,
#doc,
#page-outer { height: 100% }
.wrapper,
.wrapper-narrow,
.wrapper-permalink {
position: relative;
width: 837px;
min-height: 100%;
padding: 54px 14px 15px;
margin: 0 auto;
background: url(../img/wash-white-30.png);
}
.wrapper { padding-bottom: 0 }
.wrapper-narrow { width: 630px }
.wrapper-permalink { width: 540px }
.wrapper-unsubscribe {
width: auto;
max-width: 520px;
}
.container {
position: relative;
width: 837px;
margin: 0 auto;
}
.page-canvas {
position: relative;
width: 835px;
margin: 0 auto;
}
.dashboard {
float: left;
width: 302px;
}
.flipped-dashboard .dashboard {
float: right;
margin-left: 10px;
}
.flipped-dashboard .dashboard .chev-right { display: none }
.content-inner,
.content-narrow,
.page-canvas,
.permalink { background-clip: padding-box }
.content-narrow,
.page-canvas {
border: 1px solid #eee;
border: 1px solid rgba(0,0,0,.1);
}
.content-main,
.content-narrow,
.page-canvas,
.permalink { border-radius: 6px }
.content-main {
float: right;
width: 522px;
}
.content-narrow {
padding: 30px 50px;
margin: 0 auto 10px;
background-color: #fff;
}
.permalink {
padding: 0;
background-color: #f5f5f5;
border: 1px solid #eee;
border: 1px solid rgba(0,0,0,.1);
}
.permalink-inner { position: relative }
.content-inner {
padding: 12px;
background-color: #fff;
border-left: 1px solid #eee;
border-left: 1px solid rgba(0,0,0,.1);
border-right: 1px solid #eee;
border-right: 1px solid rgba(0,0,0,.1);
}
.content-inner>h3 {
margin-top: 10px;
margin-bottom: 10px;
font-weight: bold;
line-height: 20px;
}
.content-inner hr { margin: 20px -12px }
.content-inner.no-stream-end {
margin-bottom: 14px;
border-bottom: 1px solid #eee;
border-bottom: 1px solid rgba(0,0,0,.1);
border-radius: 0 0 6px 6px;
}
.error-page .heading {
margin-bottom: 10px;
font-size: 30px;
font-weight: 200;
}
.pushstate-spinner {
display: inline-block;
opacity: 0;
margin-top: 7px;
margin-left: -24px;
height: 24px;
width: 24px;
vertical-align: top;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
-webkit-transform: scale();
-moz-transform: scale();
transform: scale();
}
.pushing-state .pushstate-spinner {
opacity: 1;
-webkit-transform: scale(1);
-moz-transform: scale(1);
transform: scale(1);
background: url(../img/spinner-medium.gif) no-repeat 0 0;
}
.pushing-state .bird-topbar-etched {
opacity: 0;
-webkit-transform: scale();
-moz-transform: scale();
transform: scale();
}
.module {
position: relative;
margin-bottom: 10px;
line-height: 16px;
border-radius: 6px;
background-clip: padding-box;
}
.module {
text-shadow: 0 1px 0 #fff;
border: 1px solid #eee;
border: 1px solid rgba(0,0,0,.1);
}
.header-module { background-color: #fff }
.header-module .flex-module {
padding-top: 15px;
padding-bottom: 15px;
}
.header-module h2 {
font-weight: normal;
line-height: 30px;
}
.header-module .search-header {
float: right;
width: 508px;
}
.header-module .search-query {
display: block;
padding: 2px 12px 3px;
font-size: 18px;
font-weight: bold;
color: #333;
}
.search-header.swift-search-header { margin-bottom: 21px }
.search-header .search-btn {
margin-right: 1px;
text-align: center;
}
.header-module .btn .combo-btn-action { text-align: center }
.search-header .btn-group .dropdown-caret { right: 13px }
.module .flex-module {
background-color: #f9f9f9;
padding: 12px;
line-height: 16px;
}
.flex-module-header { margin-bottom: 10px }
.flex-module-header h3 { display: inline }
.flex-module-header small { line-height: 1 }
.flex-module-header p {
font-size: 12px;
color: #999;
}
.flex-module-inner,
.flex-module-footer {
color: #999;
font-size: 12px;
}
.flex-module-footer { margin-top: 10px }
.flex-module-inner ul,
.flex-module-inner ol { color: #333 }
.follow-card .flex-module-header h1 {
margin-right: 42px;
word-wrap: break-word;
}
.module ul+.flex-module { border-top: 1px solid #e8e8e8 }
.module-banner .flex-module {
font-size: 13px;
line-height: 18px;
color: #3b372e;
text-shadow: 0 1px 1px rgba(255,255,255,.5);
background-color: #f4e5c7;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#fcf8e3 0,#f4e5c7 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#fcf8e3),color-stop(100%,#f4e5c7));
background-image: -webkit-linear-gradient(top,#fcf8e3 0,#f4e5c7 100%);
background-image: -ms-linear-gradient(top,#fcf8e3 0,#f4e5c7 100%);
background-image: -o-linear-gradient(top,#fcf8e3 0,#f4e5c7 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FCF8E3',endColorstr='#f4e5c7',GradientType=0);
background-image: linear-gradient(top,#fcf8e3 0,#f4e5c7 100%);
border: 1px solid;
border-color: #fefcf0 #faf3df #f7ebd5;
}
.module-banner .first-banner-row { padding-right: 20px }
.module-banner .second-banner-row { margin-top: 5px }
.module-banner .second-banner-row .btn {
margin-right: 5px;
font-weight: normal;
border-color: rgba(0,0,0,.2);
background-clip: padding-box;
}
.module-banner .warning {
font-weight: bold;
background-color: #FCC;
background-image: none;
border: 1px solid #F77;
}
.module .contrast-flex-module {
background: #333 url(../img/stork_bg.png) repeat-x top left;
color: #ddd;
text-shadow: 0 -1px 0 #333;
padding: 12px;
}
.contrast-module-header h3 {
color: #eee;
font-size: 14px;
line-height: 18px;
}
.contrast-module-inner,
.contrast-module-footer {
color: #fff;
font-size: 12px;
margin-top: 4px;
}
.contrast-flex-module .pointer {
position: absolute;
top: 15px;
right: -25px;
background-image: url(../img/twitter_web_sprite_icons.png);
}
.stork-pip {
position: absolute;
z-index: 300;
cursor: pointer;
margin: 15px -45px;
background-image: url(../img/twitter_web_sprite_icons.png);
}
.stork-icon {
width: 15px;
height: 17px;
margin: 12px 17px;
}
.stork {
position: absolute;
width: 295px;
margin: 4px -305px;
border: 1px solid #222;
border: 1px solid rgba(0,0,0,0.75);
-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.8);
box-shadow: 0 0 4px rgba(0,0,0,0.8);
}
.stork-open { z-index: 301 }
.stork p { margin-bottom: 8px }
.stork-dismiss {
font-size: 12px;
color: #777;
}
.stork-highlight-container {
position: relative;
display: inline-block;
vertical-align: top;
}
.stork-highlighted {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
color: #fafafa!important;
}
.stork-highlighted.pretty-link s,
.stork-highlighted.pretty-link b { color: #fafafa!important }
.stork-highlight-background {
display: block;
position: absolute;
top: 0;
right: -3px;
left: -3px;
bottom: -3px;
background-color: #0079a5;
border: 1px solid #006488;
border-radius: 4px;
}
.module .list-link {
background-color: #f9f9f9;
border-top: 1px solid #e8e8e8;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
.module li:first-child .list-link,
.module .inner:first-child { border-top: 0 }
.module ul:first-child li:first-child .list-link,
.module .flex-module:first-child,
.module .contrast-flex-module:first-child {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
}
.module ul:last-child li:last-child .list-link,
.module ul:last-child li.last-item .list-link,
.module .list-link.last,
.module .flex-module:last-child,
.module .contrast-flex-module:last-child {
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.dashboard .stats { background-color: #f9f9f9 }
.module .list-link {
position: relative;
display: block;
padding: 8px 12px;
}
.module.sidebar-nav .list-link i { margin-right: 10px }
.module .list-link .count {
font-weight: normal;
color: #999;
}
.module .list-link .metadata {
display: block;
font-size: 12px;
}
.module .list-link:hover,
.module .active .list-link {
background-color: #fff;
color: #333;
text-decoration: none;
}
.module .active .list-link { font-weight: bold }
.module .active .list-link:focus { text-decoration: underline }
.mozilla .module .active .list-link {
padding-top: 9px;
padding-bottom: 7px;
}
.webkit .module .active .list-link {
padding-top: 7px;
padding-bottom: 9px;
}
.module .active .list-link small {
font-weight: normal;
color: #333;
}
.module .list-action { display: block }
.profile-nav .component .component .list-link { border-radius: 0 0 5px 5px }
.enhanced-media-thumbnails .flex-module { padding: 13px 0 12px 0 }
.enhanced-media-thumbnails .media-thumbnail { cursor: pointer }
.enhanced-media-thumbnails .list-link.last {
border-top: 0;
margin-top: -10px;
}
.enhanced-media-thumbnails:hover .media-thumbnails,
.enhanced-media-thumbnails:hover .list-link.last { background: #fff }
.module .chev-right {
position: absolute;
top: 9px;
right: 12px;
}
.module .unread {
float: right;
margin-top: 2px;
margin-right: 10px;
}
.list-action {
padding: 8px 12px;
margin: -8px -12px;
}
.list-action:hover { text-decoration: none }
.search-nav .component .component:last-child .list-link { border-radius: 0 0 5px 5px }
.content-header,
.content-no-header {
border: 1px solid #eee;
border: 1px solid rgba(0,0,0,.1);
border-radius: 6px 6px 0 0;
background-clip: padding-box;
}
.content-header { border-bottom-width: 0 }
.content-header .header-inner,
.content-no-header .no-header-inner {
min-height: 20px;
padding: 12px;
background-color: #fff;
border-bottom: 1px solid #e8e8e8;
border-radius: 5px 5px 0 0;
}
.content-header .content-type { font-weight: normal }
.content-header-buttons .btn {
float: right;
padding: 2px 8px;
margin-top: -1px;
}
.content-header .subheader {
color: #999;
margin-top: 3px;
}
.content-no-header {
border-bottom-width: 1px;
border-radius: 6px;
}
.content-no-header .no-header-inner {
padding: 30px 50px;
border-bottom: 0;
border-radius: 5px;
}
.view-toggler a,
.view-toggler {
font-weight: normal;
line-height: 1;
}
.view-toggler .active {
color: #333;
font-weight: bold;
}
.timelines-navigation {
float: right;
margin-top: 2px;
}
.timelines-navigation .profile-nav-btn {
float: left;
margin-left: 15px;
}
.timelines-navigation .profile-nav-link { float: left }
.timelines-navigation .profile-nav-icon {
float: left;
line-height: 1;
}
.topbar {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 1000;
-webkit-box-shadow: 0 2px 3px rgba(0,0,0,.25);
box-shadow: 0 2px 3px rgba(0,0,0,.25);
}
.global-nav,
.global-nav-outer { height: 40px }
.global-nav {
position: relative;
width: 100%;
}
.global-nav .container {
width: 865px;
text-align: center;
}
@media screen and (max-width:865px) {
.global-nav #global-nav-search .search-input { width: 100px }
.global-nav #global-actions li span.text { display: none }
.global-nav .container {
width: auto;
min-width: 520px;
}
#global-actions.nav i { margin-right: 0 }
#global-actions.nav i.nav-new { margin-left: -12px }
}
@media screen and (max-width:700px) {
.global-nav #global-nav-search .search-input { width: 50px }
.global-nav form.js-search-form { width: 50px }
}
.global-nav [role=navigation],
.nav,
.nav>li { float: left }
.nav {
margin-right: 12px;
text-align: left;
}
.nav li { position: relative }
.nav li a {
position: relative;
font-size: 12px;
}
.nav>li>a {
display: block;
height: 12px;
padding: 13px 12px 15px;
font-weight: bold;
line-height: 1;
color: #bbb;
text-shadow: 0 -1px 1px rgba(0,0,0,.75);
}
.nav .active>a,
.nav>li>a:hover {
color: #fff;
text-decoration: none;
}
.nav>li>a:focus {
color: #fff;
text-decoration: underline;
}
.nav small { font-weight: normal }
.nav i {
float: left;
margin: -4px 6px 0 0;
}
.nav>li>.nav-logo-link { padding: 10px 14px 18px }
.nav>li>.nav-logo-link:focus .icon {
outline: dotted 1px #fff;
outline: auto 5px -webkit-focus-ring-color;
}
.nav .active a {
color: #fff;
text-shadow: 0 1px 1px rgba(0,0,0,.5);
background-color: #222;
-webkit-box-shadow: inset 0 5px 10px rgba(0,0,0,.5);
box-shadow: inset 0 5px 10px rgba(0,0,0,.5);
}
.global-nav .account-summary {
min-height: 32px;
padding-top: 5px;
padding-bottom: 5px;
margin-bottom: 0;
}
.global-nav .account-summary .avatar {
top: 5px;
left: 22px;
-webkit-box-shadow: none;
box-shadow: none;
}
.global-nav .account-summary .content {
padding-right: 15px;
margin-top: 1px;
margin-right: 0;
line-height: 14px;
}
.global-nav .current-user .fullname { font-size: 13px }
.global-nav .account-summary:hover .fullname {
color: #fff;
text-decoration: none;
}
.global-nav .account-summary:hover .metadata { color: #fff }
.global-nav .current-user .metadata {
display: block;
font-size: 11px;
}
.global-nav .dropdown-menu .messages a { font-weight: bold }
.global-nav .messages .count {
float: right;
display: none;
min-width: 7px;
padding: 0 9px;
margin-right: -5px;
color: #fff;
text-shadow: none;
background-color: #58b3f0;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#3aa0ea 0,#58b3f0 100%);
background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,#3aa0ea),color-stop(100%,#58b3f0));
background-image: -webkit-linear-gradient(top,#3aa0ea 0,#58b3f0 100%);
background-image: -ms-linear-gradient(top,#3aa0ea 0,#58b3f0 100%);
background-image: -o-linear-gradient(top,#3aa0ea 0,#58b3f0 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3aa0ea',endColorstr='#58b3f0',GradientType=0);
background-image: linear-gradient(top,#3aa0ea 0,#58b3f0 100%);
border-radius: 9px;
}
.global-nav .messages:hover .count {
background: #fff;
color: #666;
}
.global-nav .messages .count.new { display: block }
.global-nav .well {
padding: 1px;
margin-top: 5px;
border-radius: 5px;
}
.nav .new-wrapper {
position: relative;
float: left;
}
.rtl .nav .new-wrapper { float: none }
.nav .nav-new {
position: absolute;
top: 26px;
left: 50%;
display: none;
height: 3px;
margin-left: -15px;
line-height: 1;
text-align: center;
}
.nav .new .nav-new { display: block }
.nav .dropdown-toggle .nav-new { margin-left: -14px }
.pull-right {
float: right;
text-align: left;
}
.topbar-divider {
float: left;
margin: 3px 10px;
}
.global-nav .pull-right .nav {
position: relative;
z-index: 5;
margin: 0 -12px;
}
.global-nav .pull-right .dropdown-toggle {
padding-left: 12px;
padding-right: 12px;
}
.global-nav .pull-right .nav-me { margin-right: 4px }
.global-nav .pull-right .secondary-nav {
margin-left: 6px;
margin-right: 0;
}
.bird-topbar-etched {
margin-top: 7px;
margin-left: -24px;
display: inline-block;
-webkit-transition: all .25s ease-in-out;
-moz-transition: all .25s ease-in-out;
transition: all .25s ease-in-out;
}
@media screen and (max-width:865px) {
.bird-topbar-etched { margin-left: 48px }
.rtl .bird-topbar-etched {
margin-left: 48px;
margin-right: 0;
}
}
@media screen and (max-width:700px) {
.bird-topbar-etched { margin-left: -48px }
.rtl .bird-topbar-etched {
margin-left: -48px;
margin-right: 0;
}
}
.topbar-tweet-btn {
float: left;
margin-right: 13px;
}
.btn-tweet {
float: left;
padding: 3px 4px 5px 10px;
font-size: 12px;
line-height: 20px;
color: #bbb;
text-shadow: 0 -1px 1px rgba(0,0,0,.3);
border-color: #111;
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
}
.rtl .btn-tweet { padding: 3px 10px 5px 4px }
.btn-tweet .nav-tweet {
float: left;
margin-top: 0;
}
.btn-tweet:hover {
color: #fff;
border-color: #000;
}
.btn-tweet:active {
-webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.25);
box-shadow: inset 0 3px 6px rgba(0,0,0,.25);
}
.global-nav [role=search] { float: left }
.global-nav .form-search {
position: relative;
float: left;
margin: 7px 0;
font-size: 12px;
}
.global-nav .search-icon {
position: absolute;
top: 0;
right: 2px;
display: block;
width: 26px;
height: 26px;
cursor: pointer;
}
.global-nav .nav-search {
margin-top: 3px;
margin-left: 7px;
background-color: transparent;
}
.global-nav .search-input {
display: block;
width: 163px;
height: 14px;
padding: 6px 27px 6px 12px;
font-size: 12px;
line-height: 1;
color: #666;
background-color: #ccc;
border: 0;
border-radius: 13px;
-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.lt-ie10 .global-nav .search-input { min-height: auto }
.global-nav .search-input:-moz-placeholder { color: #666 }
.global-nav .search-input::-webkit-input-placeholder {
color: #666;
line-height: 16px;
}
.global-nav .highlight .search-input {
width: 165px;
background-color: #ccc;
color: #333;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.4);
box-shadow: inset 0 1px 1px rgba(0,0,0,.4);
}
.global-nav .search-input:focus:-moz-placeholder { color: #ccc }
.global-nav .search-input:focus::-webkit-input-placeholder { color: #ccc }
.global-nav .search-input:focus,
.global-nav .search-input.focus {
color: #666;
text-shadow: none;
background-color: #fff;
-webkit-box-shadow: none;
box-shadow: none;
}
.global-nav .form-search {
width: 202px;
height: 26px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment