html
{
	height: 100%;
}

div.img
{
	display: inline-block;
}

/* BEGIN: images only here, since we will have to manage standard and retina variants */

body { background-image: url('../img/bkg-brick.png'); }
div#top-img-holder { background-image: url('../img/top-img-vstripe.png'); }
div#top-img { background-image: url('../img/top-img.png'); }
div#top-img-shadow { background-image: url('../img/top-img-shadow.png'); }
div#share-facebook { background-image: url('../img/link-facebook.png'); }
div#share-twitter{ background-image: url('../img/link-twitter.png'); }
/*div#titlebar-bkg { background-image: url('../img/contents-bkg-hstripe.png'); }*/
div#titlebar { background-image: url('../img/the-kid-apps.png'); }
div#app-description-holder-bkg { background-image: url('../img/the-kid-apps.png'); }
div#app-icon-colors { background-image: url('../img/app-icon-colors.png'); }
div#app-icon-numbers { background-image: url('../img/app-icon-numbers.png'); }
div#app-icon-shapes { background-image: url('../img/app-icon-shapes.png'); }
div#app-icon-cars { background-image: url('../img/app-icon-cars.png'); }
div#app-title-colors { background-image: url('../img/app-title-colors.png'); }
div#app-title-numbers { background-image: url('../img/app-title-numbers.png'); }
div#app-title-shapes { background-image: url('../img/app-title-shapes.png'); }
div#app-title-cars { background-image: url('../img/app-title-cars.png'); }
div.app-appstore { background-image: url('../img/appstore.png'); }

@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max--moz-device-pixel-ratio: 2) 
{

    body { background-image: url('../img/bkg-brick@2x.png'); }
    div#top-img-holder { background-image: url('../img/top-img-vstripe@2x.png'); }
    div#top-img { background-image: url('../img/top-img@2x.png'); }
    div#top-img-shadow { background-image: url('../img/top-img-shadow@2x.png'); }
    div#share-facebook { background-image: url('../img/link-facebook@2x.png'); }
    div#share-twitter{ background-image: url('../img/link-twitter@2x.png'); }
    /*div#titlebar-bkg { background-image: url('../img/contents-bkg-hstripe@2x.png'); }*/
    div#titlebar { background-image: url('../img/the-kid-apps@2x.png'); }
    div#app-icon-colors { background-image: url('../img/app-icon-colors@2x.png'); }
    div#app-icon-numbers { background-image: url('../img/app-icon-numbers@2x.png'); }
    div#app-icon-shapes { background-image: url('../img/app-icon-shapes@2x.png'); }
    div#app-icon-cars { background-image: url('../img/app-icon-cars@2x.png'); }
    div#app-title-colors { background-image: url('../img/app-title-colors@2x.png'); }
    div#app-title-numbers { background-image: url('../img/app-title-numbers@2x.png'); }
    div#app-title-shapes { background-image: url('../img/app-title-shapes@2x.png'); }
    div#app-title-cars { background-image: url('../img/app-title-cars@2x.png'); }
    div.app-appstore { background-image: url('../img/appstore@2x.png'); }

}

/* END: images only here, since we will have to manage standard and retina variants */

body
{
    background-repeat: repeat;
    background-size: 50px 28px;
	padding: 0;
	margin: 0;
	height: 100%;
	font-family: Arial, Helvetica, sans-serif;
}

div#main-page
{
}

div#top-img-holder
{
    background-repeat: repeat-x;
    background-size: 1px 172px;
	text-align: center;
	vertical-align: middle;
	height: 200px;
}
div#top-img
{
	background-repeat: no-repeat;
	background-position: center;
    background-size: 1024px 172px;
	height: 172px;
}
div.share
{
    position: absolute;
    top: 172px;
    background-repeat: no-repeat;
    background-size: 40px 40px;
	height: 40px;
    width: 40px;
}
div#top-img-shadow
{
	background-repeat: repeat-x;
    background-size: 1px 40px;
	height: 40px;
}

div#titlebar-holder
{
	text-align: center;
	vertical-align: middle;
	height: 160px;
}
/*
div#titlebar-bkg
{
    background-repeat: repeat-y;
    background-size: 700px 1px;
    margin: 0 auto;
    z-index: -1;
    width: 700px;
    height: 160px;
}*/
div#titlebar
{
    /*position: relative;
    top: -150px;
    z-index: 1;*/
	background-repeat: no-repeat;
	background-position: center;
    background-size: 300px 96px;
	height: 150px;
}

div#main-contents
{
	text-align: center;
}
/*
div#app-description-holder-bkg
{
    background-repeat: repeat-y;
    background-size: 700px 1px;
    width: 700px;
   	height: 250px;
   	margin: 0 auto;
   	padding: 0;
}*/
div#app-description-holder
{
	width: 630px;
	height: 165px;
	margin: 0 auto;
	padding: 0;
}
div.app-description
{
	margin: 5px;
	display: inline-block;
	width: 140px;
	padding: 0;
}

div.app-icon
{
	background-repeat: no-repeat;
    background-size: 120px 106px;
	height: 106px;
	width: 120px;
	margin: 0 auto;
}
div.app-title
{
	background-repeat: no-repeat;
    background-size: 100px 44px;
	height: 44px;
	width: 100px;
	margin: 0 auto;
}
div.app-text
{
	font-size: 0.8em;
	color: white;
	height: 95px;
	width: 120px;
	margin: 0 auto;
}
div.app-appstore
{
	background-repeat: no-repeat;
	background-size: 100px 30px;
	height: 70px;
	width: 100px;
	margin: 0 auto;
    padding-bottom: 10px;
}