body.ui-mobile-viewport {
	margin: 0 auto;
	max-width: 1024px;
}

#logo {
	text-align: center;
	display: block;
}
#logo img{
	margin: 10px 5px 5px 5px;
	max-width: 200px;
}
#slogan {
	text-align: center;
}

.ui-content {
	ul {
		padding: 0 0 0 1em;
	}
	ul.ui-listview {
		padding: 0;
	}
	.intro {
		margin: 0 0 2em 0;
	}
	img {
		max-width: 100%;
	}
}

#action {
	margin: 0 -1em;
	padding: 1em;
	color: #fff;
  text-shadow: 0px 1px 0px #999;
	&.error {
    background: #EB313C;
    text-shadow: 0px 1px 0px #333;
	}
	&.warning {
    background: #E9A86E;
}
	&.notice {
	    background: #93CAF4;
	}
	&.info {
	    background: #97DD8A;
	}
}

/* hack to fadein loader widget (will break normal loader usage) */
.ui-loader {
	display: block;
	opacity: 0;
	transition: opacity 0.5s linear;
}
.ui-loading .ui-loader.fadeIn {
	opacity: 0.18;
}

/* Add to home */
.ath-viewport {
	.ath-container {
		box-shadow: 0 0 0 0.2em #D1D1D1;
		background-color: #fff;
	}
	.ath-ios.ath-phone:after,
	.ath-ios.ath-tablet:after,
	.ath-android:after {
		background-color: #fff;
	}
	.ath-android:after {
		background: -webkit-linear-gradient(-45deg,	rgba(255,255,255,0) 0,
																								rgba(255,255,255,0) 50%,
																								rgba(255,255,255,1) 50%,
																								rgba(255,255,255,1) 100%);
	}
	// add shadow around up arrow
	.ath-ios.ath-tablet:after {
		box-shadow: -.2em -.2em 0 #d1d1d1;
	}
	// close cross color
	.ath-container:before {
		color: #F18DB1;
	}
}