html{
	height: 100%;
}
body{
	opacity: 0;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 16px;
	margin: 0;
	padding: 0;
	height: 100%;
	background-color: #fff;
	overflow: hidden;
	position: relative;
	word-wrap: break-word;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-ms-transition: opacity 1s;
	-o-transition: opacity 1s;
	transition: opacity 1s;
}
body.show{
	opacity: 1;
}
pre{
	word-wrap: normal;
}
header.fake{
	pointer-events: none;
	position: absolute;
	top: 0;
	left: 0;
}
.view{
	position: absolute;
	width: 100%;
	height: 100%;
	display: -webkit-box;
	display: -moz-box;
	display: box;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	box-orient: vertical;
}
.view.hidden{
	left: -9999px;
}
header.fake,
.view>header{
	background: #b2bbca url(images/navbar-bg.png) repeat-x;
	-webkit-background-size: 1px 44px;
	-moz-background-size: 1px 44px;
	-ms-background-size: 1px 44px;
	-o-background-size: 1px 44px;
	background-size: 1px 44px;
	height: 44px;
	line-height: 44px;
	width: 100%;
	color: #fff;
	-webkit-user-select: none;
	-webkit-touch-callout: none;
}
.view>header.transparent{
	background: transparent none;
}
.header-button{
	position: absolute;
	top: 0;
	padding: 7px 5px;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	line-height: 1em;
}
.header-button button{
	pointer-events: none;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	min-width: 50px;
	height: 30px;
	line-height: 25px;
	font-weight: bold;
	font-size: 12px;
	text-align: center;
	color: #fff;
	text-shadow: 0 -1px rgba(0,0,0,.6);
	padding: 0 4px;
	margin: 0;
	text-decoration: none;
	border-width: 2px 5px;
	-webkit-border-image: url(images/button.png) 4 10 4 10;
	-moz-border-image: url(images/button.png) 4 10 4 10;
	-ms-border-image: url(images/button.png) 4 10 4 10;
	-o-border-image: url(images/button.png) 4 10 4 10;
/*	border-image: url(images/button.png) 4 10 4 10;*/
	background: transparent url(images/button-active.png) no-repeat;
	-webkit-background-size: 0 0;
	-moz-background-size: 0 0;
	-ms-background-size: 0 0;
	-o-background-size: 0 0;
	background-size: 0 0;
}
.header-button-icon button{
	min-width: 0;
}
.header-button-icon button img{
	vertical-align: text-bottom;
}
.header-button.tappable-active button{
	-webkit-border-image: url(images/button-active.png) 4 10 4 10;
	-moz-border-image: url(images/button-active.png) 4 10 4 10;
	-ms-border-image: url(images/button-active.png) 4 10 4 10;
	-o-border-image: url(images/button-active.png) 4 10 4 10;
/*	border-image: url(images/button-active.png) 4 10 4 10;*/
}
.header-back-button button{
	padding: 0 4px 0 0;
	border-width: 2px 4px 2px 13px;
	-webkit-border-image: url(images/back-button.png) 4 8 4 26;
	-moz-border-image: url(images/back-button.png) 4 8 4 26;
	-ms-border-image: url(images/back-button.png) 4 8 4 26;
	-o-border-image: url(images/back-button.png) 4 8 4 26;
/*	border-image: url(images/back-button.png) 4 8 4 26;*/
	background-image: url(images/back-button-active.png);
}
.header-back-button.tappable-active button{
	-webkit-border-image: url(images/back-button-active.png) 4 8 4 26;
	-moz-border-image: url(images/back-button-active.png) 4 8 4 26;
	-ms-border-image: url(images/back-button-active.png) 4 8 4 26;
	-o-border-image: url(images/back-button-active.png) 4 8 4 26;
/*	border-image: url(images/back-button-active.png) 4 8 4 26;*/
}
.header-button-left{
	left: 0;
}
.header-button-right{
	right: 0;
}
.view>header h1{
	padding: 0;
	text-align: center;
	font-size: 20px;
	text-shadow: 0 -1px rgba(0,0,0,.4);
	margin: 0;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
}
.view>header h1 img{
	vertical-align: -15%;
	border: 1px solid #fff;
}
.view>.scroll{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	background-color: #e2e7ed;
	display: -webkit-box;
	display: -moz-box;
	display: box;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	box-orient: vertical;
	height: 100%;
}
.view>.scroll.striped{
	background-color: #cbd2d8;
	background-image: -webkit-gradient(linear, left top, right top, from(#c5ccd4), color-stop(0.714, #c5ccd4), color-stop(0.714, #cbd2d8), to(#cbd2d8)); 
	background-image: -webkit-linear-gradient(left, #c5ccd4, #c5ccd4 71.4%, #cbd2d8 71.5%, #cbd2d8);
	background-image: -moz-linear-gradient(left, #c5ccd4, #c5ccd4 71.4%, #cbd2d8 71.5%, #cbd2d8);
	background-image: -ms-linear-gradient(left, #c5ccd4, #c5ccd4 71.4%, #cbd2d8 71.5%, #cbd2d8);
	background-image: -o-linear-gradient(left, #c5ccd4, #c5ccd4 71.4%, #cbd2d8 71.5%, #cbd2d8);
	background-image: linear-gradient(left, #c5ccd4, #c5ccd4 71.4%, #cbd2d8 71.5%, #cbd2d8);
	-webkit-background-size: 7px 1px;
	-moz-background-size: 7px 1px;
	-ms-background-size: 7px 1px;
	-o-background-size: 7px 1px;
	background-size: 7px 1px;
}
.view>.scroll.striped p.foot-label{
	margin: 11px 10px 0;
	font-size: 14px;
	color: #4c566c;
	text-shadow: 0 1px #fff;
	text-align: center;
}
.view>.scroll>section{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
.view>.scroll>.loader{
	display: none;
	pointer-events: none;
	margin: 0 0 0 -50px;
	position: absolute;
	top: 45%;
	left: 50%;
	height: 20px;
	line-height: 20px;
	padding-left: 26px;
	color: #666;
	text-shadow: 0 1px #fff;
	background: transparent url(images/activity-indicator.png) no-repeat;
	-webkit-background-size: 20px auto;
	-moz-background-size: 20px auto;
	background-size: 20px auto;
	-webkit-animation: loading-sprite 1s step-start infinite;
	-moz-animation: loading-sprite 1s step-start infinite;
	animation: loading-sprite 1s step-start infinite;
}
.view>.scroll.striped>.loader{
	color: #2f343c;
}
.view>.scroll.loading{
	position: relative;
	background-color: transparent;
}
.view>.scroll.loading>.loader{
	display: block;
}
@-webkit-keyframes loading-sprite {
	0% { background-position: 0 0; }
	8.33% { background-position: 0 -20px; }
	16.67% { background-position: 0 -40px; }
	25% { background-position: 0 -60px; }
	33.33% { background-position: 0 -80px; }
	41.67% { background-position: 0 -100px; }
	50% { background-position: 0 -120px; }
	58.33% { background-position: 0 -140px; }
	66.67% { background-position: 0 -160px; }
	75% { background-position: 0 -180px; }
	83.33% { background-position: 0 -200px; }
	91.67% { background-position: 0 -220px; }
	100% { background-position: 0 0; }
}
@-moz-keyframes loading-sprite {
	0% { background-position: 0 0; }
	8.33% { background-position: 0 -20px; }
	16.67% { background-position: 0 -40px; }
	25% { background-position: 0 -60px; }
	33.33% { background-position: 0 -80px; }
	41.67% { background-position: 0 -100px; }
	50% { background-position: 0 -120px; }
	58.33% { background-position: 0 -140px; }
	66.67% { background-position: 0 -160px; }
	75% { background-position: 0 -180px; }
	83.33% { background-position: 0 -200px; }
	91.67% { background-position: 0 -220px; }
	100% { background-position: 0 0; }
}
@keyframes loading-sprite {
	0% { background-position: 0 0; }
	8.33% { background-position: 0 -20px; }
	16.67% { background-position: 0 -40px; }
	25% { background-position: 0 -60px; }
	33.33% { background-position: 0 -80px; }
	41.67% { background-position: 0 -100px; }
	50% { background-position: 0 -120px; }
	58.33% { background-position: 0 -140px; }
	66.67% { background-position: 0 -160px; }
	75% { background-position: 0 -180px; }
	83.33% { background-position: 0 -200px; }
	91.67% { background-position: 0 -220px; }
	100% { background-position: 0 0; }
}
.tableview{
	margin: 0;
	padding: 0;
	list-style: none;
	background-color: #fff;
	border-bottom: 1px solid #e0e0e0;
}
.tableview li{
	display: block;
	border-top: 1px solid #e0e0e0;
	padding: 10px;
}
.tableview-links li{
	padding: 0;
	display: -webkit-box;
	display: -moz-box;
	display: box;
	width: 100%;
}
.tableview-links li>a{
	font-size: 15px;
	line-height: 1.3em;
	color: #000;
	display: block;
	padding: 5px;
	text-decoration: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	display: -webkit-box;
	display: -moz-box;
	display: box;
	width: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#4286f5), to(#194fdb));
	background-image: -webkit-linear-gradient(top, #4286f5, #194fdb);
	background-image: -moz-linear-gradient(top, #4286f5, #194fdb);
	background-image: -ms-linear-gradient(top, #4286f5, #194fdb);
	background-image: -o-linear-gradient(top, #4286f5, #194fdb);
	background-image: linear-gradient(top, #4286f5, #194fdb);
	background-position: -10px 0;
	background-repeat: no-repeat;
	-webkit-background-size: 10px 100%;
	-moz-background-size: 10px 100%;
	-ms-background-size: 10px 100%;
	-o-background-size: 10px 100%;
	background-size: 10px 100%;
}
.tableview-links li>a:visited{
	color: #666;
}
.tableview-links li>a *{
	pointer-events: none;
}
.tableview-links li>a b small{
	color: #666d74;
	font-weight: normal;
}
.tableview-links li>a .number{
	text-align: right;
	width: 3ex;
	padding-right: 5px;
	color: #666d74;
}
.tableview-links li>a .story{
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
}
.tableview-links li>a .metadata{
	display: block;
	font-size: 13px;
	color: #666d74;
	line-height: 1.2em;
}
.tableview-links li>a.pad-right{
	padding-right: 44px;
}
.tableview-links li>a.more-link{
	cursor: pointer;
	-webkit-touch-callout: none;
	line-height: 3em;
	padding: 10px;
	display: block;
	color: #2960d9;
	text-align: center;
	font-weight: bold;
}
.tableview-links li>a.more-link.loading{
	position: relative;
	pointer-events: none;
}
.tableview-links li>a.more-link.loading .loader{
	display: block;
	position: absolute;
	top: 50%;
	right: 20px;
	margin: -10px 0 0;
	width: 20px;
	height: 20px;
	background: transparent url(images/activity-indicator.png) no-repeat;
	-webkit-background-size: 20px auto;
	-moz-background-size: 20px auto;
	background-size: 20px auto;
	-webkit-animation: loading-sprite 1s step-start infinite;
	-moz-animation: loading-sprite 1s step-start infinite;
	animation: loading-sprite 1s step-start infinite;
}
.tableview-links li>a.tappable-active{
	color: #fff;
	background-color: #4286f5;
	background-repeat: repeat-x;
}
.tableview-links li>a.tappable-active *{
	color: #fff;
}
.tableview-links li>a.detail-disclosure{
	-webkit-touch-callout: none;
	padding: 0;
	width: 44px;
	margin: 0 0 0 -44px;
	-webkit-box-align: center;
	-moz-box-align: center;
	box-align: center;
	-webkit-box-pack: center;
	-moz-box-pack: center;
	box-pack: center;
	-webkit-box-flex: 0;
	-moz-box-flex: 0;
	box-flex: 0;
}
.tableview-links li>a.detail-disclosure.tappable-active{
	background: transparent none;
}
.tableview-links li>a.detail-disclosure span{
	display: inline-block;
	width: 29px;
	height: 31px;
	background: transparent url(images/detail-disclosure-button.png);
	-webkit-background-size: 58px 31px;
	-moz-background-size: 58px 31px;
	-ms-background-size: 58px 31px;
	-o-background-size: 58px 31px;
	background-size: 58px 31px;
}
.tableview-links li>a.detail-disclosure.tappable-active span{
	background-position: top right;
}

.grouped-tableview{
	margin: 10px 9px 11px;
	border: 1px solid #a1a7ae;
	border-radius: 8px;
	padding: 10px;
	background-color: #f7f7f7;
	box-shadow: inset 0 1px rgba(0,0,0,.08), 0 1px rgba(255,255,255,.81);
	font-size: 13px;
}
.grouped-tableview + .grouped-tableview{
	margin-top: 0;
}
.grouped-tableview p{
	margin: 0 0 1em;
}
.grouped-tableview p:last-child{
	margin: 0;
}
ul.grouped-tableview,
ol.grouped-tableview{
	display: block;
	list-style: none;
	padding: 0;
}
ul.grouped-tableview li,
ol.grouped-tableview li{
	display: block;
	box-shadow: inset 0 1px #fdfdfd;
	border-bottom: 1px solid #cacaca;
	padding: 10px;
}
ul.grouped-tableview li:first-child,
ol.grouped-tableview li:first-child{
	box-shadow: none;
}
ul.grouped-tableview li:last-child,
ol.grouped-tableview li:last-child{
	border-bottom: 0;
}
ul.grouped-tableview-links li,
ol.grouped-tableview-links li{
	padding: 0;
	display: -webkit-box;
	display: -moz-box;
	display: box;
	width: 100%;
}
ul.grouped-tableview-links li>a,
ol.grouped-tableview-links li>a{
	color: #000;
	font-size: 16px;
	font-weight: bold;
	display: block;
	padding: 10px;
	text-decoration: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	display: -webkit-box;
	display: -moz-box;
	display: box;
	width: 100%;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#4286f5), to(#194fdb));
	background-image: -webkit-linear-gradient(top, #4286f5, #194fdb);
	background-image: -moz-linear-gradient(top, #4286f5, #194fdb);
	background-image: -ms-linear-gradient(top, #4286f5, #194fdb);
	background-image: -o-linear-gradient(top, #4286f5, #194fdb);
	background-image: linear-gradient(top, #4286f5, #194fdb);
	background-position: -1px 0;
	background-repeat: no-repeat;
	-webkit-background-size: 1px 100%;
	-moz-background-size: 1px 100%;
	-ms-background-size: 1px 100%;
	-o-background-size: 1px 100%;
	background-size: 1px 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
}
ul.grouped-tableview li:first-child>a,
ol.grouped-tableview li:first-child>a{
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
}
ul.grouped-tableview li:last-child>a,
ol.grouped-tableview li:last-child>a{
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
}
ul.grouped-tableview-links li>a.disclosure,
ol.grouped-tableview-links li>a.disclosure{
	position: relative;
}
ul.grouped-tableview-links li>a.disclosure:after,
ol.grouped-tableview-links li>a.disclosure:after{
	content: '';
	position: absolute;
	top: 0;
	right: 10px;
	width: 10px;
	height: 100%;
	background: transparent url(images/disclosure-indicator.png) no-repeat left center;
	background-size: 20px auto;
}
ul.grouped-tableview-links li>a *,
ol.grouped-tableview-links li>a *{
	pointer-events: none;
}
ul.grouped-tableview-links li>a.tappable-active,
ol.grouped-tableview-links li>a.tappable-active{
	box-shadow: none;
	color: #fff;
	background-color: #4286f5;
	background-repeat: repeat-x;
}
ul.grouped-tableview-links li>a.tappable-active *,
ol.grouped-tableview-links li>a.tappable-active *{
	color: #fff;
}
ul.grouped-tableview-links li>a.disclosure.tappable-active:after,
ol.grouped-tableview-links li>a.disclosure.tappable-active:after{
	background-position: right center;
}

.view .post-content header{
	padding: 10px 15px;
	text-shadow: 0 1px rgba(255,255,255,.85);
}
.view .post-content header h1,
.view .post-content header p{
	margin: 0;
	padding: 0;
}
.view .post-content header h1 a{
	display: block;
}
.view .post-content header h1 a .link-text{
	font-size: 13px;
}
.view .post-content header .metadata{
	font-size: 13px;
	color: #666d74;
}
.view .post-content header h1{
	font-size: 17px;
	line-height: 1.2em;
}
.view .post-content header h1 a{
	color: #000;
	text-decoration: none;
}
.view .post-content header + .grouped-tableview{
	margin-top: 0;
}
.view .post-content{
	padding-bottom: 1px;
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,0)), to(rgba(0,0,0,.12)));
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.12));
	background-image: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.12));
	background-image: -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.12));
	background-image: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.12));
	background-image: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,.12));
	-webkit-background-size: 1px 11px;
	-moz-background-size: 1px 11px;
	-ms-background-size: 1px 11px;
	-o-background-size: 1px 11px;
	background-size: 1px 11px;
	background-repeat: repeat-x;
	background-position: bottom;
}
.view section.comments{
	min-height: 100%;
	border-top: 1px solid #9297a2;
	background-color: #fff;
	font-size: 13px;
	overflow: hidden;
}
.view section.comments ul{
	margin: 0;
	padding: 0;
	list-style: none;
}
.view section.comments ul li{
	padding: 15px;
	border-bottom: 1px solid #ddd;
}
.view section.comments ul ul li{
	padding: 0 0 0 15px;
	border: 0;
	background: transparent url(images/comment-arrow.png) no-repeat 0 4px;
	-webkit-background-size: 10px 9px;
	-moz-background-size: 10px 9px;
	-ms-background-size: 10px 9px;
	-o-background-size: 10px 9px;
	background-size: 10px 9px;
	color: #333;
}
.view section.comments p{
	margin: 8px 0;
}
.view section.comments p.metadata{
	color: #666d74;
	padding: 0;
	margin: 0;
	display: -webkit-box;
	display: -moz-box;
	display: box;
}
.view section.comments p.metadata b{
	color: #b23914;
}
.view section.comments p.metadata time{
	display: block;
	text-align: right;
	-webkit-box-flex: 1;
	-moz-box-flex: 1;
	box-flex: 1;
	font-weight: bold;
	color: #888;
}
.view section.comments pre{
	margin: 0 0 8px;
	overflow: auto;
	padding: 5px 0;
	background-color: #eee;
}
.view section.comments p.no-comments{
	text-align: center;
	color: #aaa;
	font-weight: bold;
	margin: 50px 0 250px;
}
.view section.comments button.comments-toggle{
	display: block;
	width: 100%;
	cursor: pointer;
	border: 0;
	padding: 6px 10px;
	font-weight: bold;
	color: #666;
	background-color: #e0e0e0;
	border-radius: 6px;
	text-shadow: 0 1px rgba(255,255,255,.75);
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	margin: 2px 0 4px;
}
.view section.comments button.comments-toggle.tappable-active{
	color: #444;
	background-color: #c0c0c0;
}
.link-text{
	color: #385487;
	font-weight: bold;
}
.inline-block{
	display: inline-block;
}

/* For modern browsers */
.cf:before,
.cf:after {
	content:"";
	display:table;
}

.cf:after {
	clear:both;
}

/* For IE 6/7 (trigger hasLayout) */
.cf {
	zoom:1;
}

#y-touch-icon{
	background: transparent url(icons/touch-icon.png) no-repeat;
	background-size: 57px 57px;
	width: 57px;
	height: 57px;
	float: left;
	margin: 0 10px 0 0;
	border-radius: 9px;
	box-shadow: 0 2px 2px rgba(0,0,0,.5);
}

.view,
.view>.scroll,
.view>header h1,
.view>header .header-button{
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-duration: 350ms;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-duration: 350ms;
	animation-timing-function: ease-in-out;
	animation-duration: 350ms;
}

.sliding{
	pointer-events: none;
}

.slide-in-from-right>.scroll{
	-webkit-animation-name: slideinfromright;
	-moz-animation-name: slideinfromright;
	animation-name: slideinfromright;
}
.slide-in-from-right>header h1{
	-webkit-animation-name: slidefadeinfromright;
	-moz-animation-name: slidefadeinfromright;
	animation-name: slidefadeinfromright;
}
.slide-in-from-right>header .header-button{
	-webkit-animation-name: fadein;
	-moz-animation-name: fadein;
	animation-name: fadein;
}
.slide-in-from-right>header .header-back-button{
	-webkit-animation-name: backinfromcenter;
	-moz-animation-name: backinfromcenter;
	animation-name: backinfromcenter;
}

.slide-in-from-left>.scroll{
	-webkit-animation-name: slideinfromleft;
	-moz-animation-name: slideinfromleft;
	animation-name: slideinfromleft;
}
.slide-in-from-left>header h1{
	-webkit-animation-name: slidefadeinfromleft;
	-moz-animation-name: slidefadeinfromleft;
	animation-name: slidefadeinfromleft;
}
.slide-in-from-left>header .header-button{
	-webkit-animation-name: fadein;
	-moz-animation-name: fadein;
	animation-name: fadein;
}
.slide-in-from-left>header .header-back-button{
	-webkit-animation-name: backinfromleft;
	-moz-animation-name: backinfromleft;
	animation-name: backinfromleft;
}

.slide-in-from-bottom{
	-webkit-animation-name: slideinfrombottom;
	-moz-animation-name: slideinfrombottom;
	animation-name: slideinfrombottom;
}

.slide-out-to-right>.scroll{
	-webkit-animation-name: slideouttoright;
	-moz-animation-name: slideouttoright;
	animation-name: slideouttoright;
}
.slide-out-to-right>header h1{
	-webkit-animation-name: slidefadeouttoright;
	-moz-animation-name: slidefadeouttoright;
	animation-name: slidefadeouttoright;
}
.slide-out-to-right>header .header-button{
	-webkit-animation-name: fadeout;
	-moz-animation-name: fadeout;
	animation-name: fadeout;
}
.slide-out-to-right>header .header-back-button{
	-webkit-animation-name: backouttocenter;
	-moz-animation-name: backouttocenter;
	animation-name: backouttocenter;
}

.slide-out-to-left>.scroll{
	-webkit-animation-name: slideouttoleft;
	-moz-animation-name: slideouttoleft;
	animation-name: slideouttoleft;
}
.slide-out-to-left>header h1{
	-webkit-animation-name: slidefadeouttoleft;
	-moz-animation-name: slidefadeouttoleft;
	animation-name: slidefadeouttoleft;
}
.slide-out-to-left>header .header-button{
	-webkit-animation-name: fadeout;
	-moz-animation-name: fadeout;
	animation-name: fadeout;
}
.slide-out-to-left>header .header-back-button{
	-webkit-animation-name: backouttoleft;
	-moz-animation-name: backouttoleft;
	animation-name: backouttoleft;
}

.slide-out-to-bottom{
	-webkit-animation-name: slideouttobottom;
	-moz-animation-name: slideouttobottom;
	animation-name: slideouttobottom;
}

@-webkit-keyframes slideinfromright {
	from { -webkit-transform: translateX(100%); }
	to { -webkit-transform: translateX(0); }
}
@-webkit-keyframes slideinfromleft {
	from { -webkit-transform: translateX(-100%); }
	to { -webkit-transform: translateX(0); }
}
@-webkit-keyframes slideinfrombottom {
	from { -webkit-transform: translateY(100%); }
	to { -webkit-transform: translateY(0); }
}
@-webkit-keyframes slideouttoleft {
	from { -webkit-transform: translateX(0); }
	to { -webkit-transform: translateX(-100%); }
}
@-webkit-keyframes slideouttoright {
	from { -webkit-transform: translateX(0); }
	to { -webkit-transform: translateX(100%); }
}
@-webkit-keyframes slideouttobottom {
	from { -webkit-transform: translateY(0); }
	to { -webkit-transform: translateY(100%); }
}

@-webkit-keyframes slidefadeinfromright {
	from {
		-webkit-transform: translateX(60%);
		opacity: 0;
	}
	to {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-webkit-keyframes slidefadeinfromleft {
	from {
		-webkit-transform: translateX(-60%);
		opacity: 0;
	}
	to {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-webkit-keyframes slidefadeouttoleft {
	from {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
	to {
		-webkit-transform: translateX(-60%);
		opacity: 0;
	}
}
@-webkit-keyframes slidefadeouttoright {
	from {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
	to {
		-webkit-transform: translateX(60%);
		opacity: 0;
	}
}

@-webkit-keyframes fadein {
	from { opacity: 0; }
	to { opacity: 1; }
}
@-webkit-keyframes fadeout {
	from { opacity: 1; }
	to { opacity: 0; }
}

@-webkit-keyframes backinfromcenter {
	from {
		-webkit-transform: translateX(200%);
		opacity: 0;
	}
	to {
		left: 0;
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-webkit-keyframes backinfromleft {
	from {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
	to {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
}
@-webkit-keyframes backouttocenter {
	from {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
	to {
		-webkit-transform: translateX(200%);
		opacity: 0;
	}
}
@-webkit-keyframes backouttoleft {
	from {
		-webkit-transform: translateX(0);
		opacity: 1;
	}
	to {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
}

.viewport-flip {
	-webkit-perspective: 1000;
	background-color: #000;
}
.viewport-flip header.fake{
	visibility: hidden;
}

.flip {
	background-color: #fff;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-duration: .7s;
	-webkit-backface-visibility: hidden;
	-webkit-transform:;
	border: 1px solid #000;
	margin: -1px;
	pointer-events: none;
}

.flip-out-to-left {
	-webkit-animation-name: flipouttoleft;
}
.flip-out-to-right {
	-webkit-animation-name: flipouttoright;
}
.flip-in-from-left {
	-webkit-animation-name: flipinfromleft;
}
.flip-in-from-right {
	-webkit-animation-name: flipinfromright;
}

@-webkit-keyframes flipinfromright {
	from { -webkit-transform: rotateY(-180deg) scale(.65); opacity: 0; }
	50% { opacity: .4; }
	to { -webkit-transform: rotateY(0) scale(1); opacity: 1; }
}

@-webkit-keyframes flipinfromleft {
	from { -webkit-transform: rotateY(180deg) scale(.65); opacity: 0; }
	50% { opacity: .4; }
	to { -webkit-transform: rotateY(0) scale(1); opacity: 1; }
}

@-webkit-keyframes flipouttoleft {
	from { -webkit-transform: rotateY(0) scale(1); opacity: 1; }
	50% { opacity: .4; }
	to { -webkit-transform: rotateY(-180deg) scale(.65); opacity: 0; }
}

@-webkit-keyframes flipouttoright {
	from { -webkit-transform: rotateY(0) scale(1); opacity: 1; }
	50% { opacity: .4; }
	to { -webkit-transform: rotateY(180deg) scale(.65); opacity: 0; }
}

@media only screen and (max-height: 280px){
	header.fake,
	.view>header{
		background-image: url(images/navbar-landscape-bg.png);
		-webkit-background-size: 1px 32px;
		-moz-background-size: 1px 32px;
		-ms-background-size: 1px 32px;
		-o-background-size: 1px 32px;
		background-size: 1px 32px;
		height: 32px;
		line-height: 32px;
	}
	.view>header h1{
		font-size: 16px;
	}
	.header-button{
		padding: 4px;
	}
	.header-button button{
		font-size: 12px;
		height: 24px;
		line-height: 18px;
		border-width: 2px 4px;
	}
	.header-back-button button{
		border-width: 2px 4px 2px 10px;
	}
	.header-button-icon button{
		line-height: 14px;
	}
	.header-button-icon button img{
		width: auto;
		height: 14px;
		margin-bottom: 2px; /* temporary hack */
	}
}