@charset "utf-8";
/* CSS Document */

@font-face {
	font-family: 'omegaRegular';
	src: url('fonts/omegact-regular-webfont.eot'); 
	src: url('fonts/omegact-regular-webfont.eot?#iefix') format('embedded-opentype'), 
			 url('fonts/omegact-regular-webfont.woff') format('woff'),
			 url('fonts/omegact-regular-webfont.ttf') format('truetype'),
			 url('fonts/omegact-regular-webfont.svg#webfont') format('svg');
}

@font-face {
	font-family: 'omegaBold';
	src: url('fonts/omegact-bold-webfont.eot'); 
	src: url('fonts/omegact-bold-webfont.eot?#iefix') format('embedded-opentype'), 
			 url('fonts/omegact-bold-webfont.woff') format('woff'),
			 url('fonts/omegact-bold-webfont.ttf') format('truetype'),
			 url('fonts/omegact-bold-webfont.svg#webfont') format('svg');
}

body {
	background-image:url(../img/bg_landscape.jpg);
	background-position:center -50px;
	background-repeat:no-repeat;
}

.ipadOnly {
	color:#666;
	font-family:omegaBold;
	font-size:26px;
	margin-top:300px;
}

html.ipadIs {
	width:1010px;
	height:660px;
	position:relative;
	margin:auto;
}

footer {
	background-image:url(../img/footer.png);
	bottom:0;
	height:81px;
	left:50%;
	margin-bottom:20px;
	margin-left:-262px;
	position:absolute;
	width:525px;
}

header {
	background-image:url(../img/header.png); 
	background-position:bottom center;
	background-repeat:no-repeat;
	height:55px;
	padding:10px 50px 0 50px;
}

.buttonLink {
	display:block;
	height:36px;
}

.btnLogout {
	background-image:url(../img/btnLogout.png);
	float:right;
	height:36px;
	width:87px;
}

.btnBack {
	background-image:url(../img/btnBack.png);
	float:left;
	height:36px;
	width:157px;
}



/******************************************* LOGIN ******************************************/
.login {
	background-image:url(../img/login_screen.png);
	height:500px;
	left:50%;
	margin-left:-350px;
	margin-top:-280px;
	position:absolute;
	top:50%;
	width:700px;
}

.disclaimer {
        height:500px;
        left:50%;
        margin-left:-350px;
        margin-top:-280px;
        position:absolute;
        top:50%;
        width:700px;
}

.login form, .disclaimer .form {
	color:#999;
	font-family:omegaRegular;
	font-size:14px;
	height:280px;
	margin-top:95px;
	padding:30px 0 0 46px;
	text-align:left;
	width:494px;
}
.login .title, .disclaimer .title {
	color:#666;
	display:block;
	font-family:omegaBold;
	font-size:26px;
}

.login .fields ul {
	margin-top:42px;
}

.login .fields ul li {
	float:left;
	margin-right:36px;
}

.login .fields label {
	display:block;
	font-family:omegaBold;
	font-size:16px;
}

.login .fields input {
	background-color:transparent;
	border:0;
	color:#666;
	height:26px;
	margin-top:14px;
	padding:0;
	width:205px;
}

.login .error ul {
	margin-top:53px;
}

.login .error ul li {
	float:left;
}

.login .error .errorText {
	display:block;
	color:#bf1b2f;
	height:50px;
	width:240px;
}

.login .error .btnLogin {
	background-color:transparent;
	background-image:url(../img/btnLogin.png);
	border:0;
	height:36px;
	margin-left:150px;
	width:69px;
}



/******************************************* OVERVIEW ******************************************/
.gallery {
	margin:150px 140px 0 140px;
	overflow:hidden;
}

#slider {
	height:270px;
	width:250px;
}

#slider_wrapper {
	height:270px;
	position:relative;
}

#slider ul {
	-moz-transform: translate3d(0px, 0pt, 0pt);
  -moz-transition-duration: 0ms;
  list-style: none outside none;
}

#slider li {
	display: table-cell;
	vertical-align: top;
	width:480px;
}

#slider li div {
	background-image:url(../img/appIconShadow.png);
	background-position:bottom center;
	background-repeat:no-repeat;
	height:200px;
	width:200px;
}

.arrows {
	display:inline;
}

.arrows a {
	height:73px;
	margin:50px 50px 0 50px;
	width:38px;
	z-index:100;
}
.arrowshome a {
	height:73px;
	margin:50px 50px 0 50px;
	width:38px;
	z-index:100;
}

#next {
	background-image:url(../img/arrowRight.png);
	position:absolute;
	right:0;
}

#prev {
	background-image:url(../img/arrowLeft.png);
	left:0;
	position:absolute;
}

#positionHolder {
	background-image:url(../img/indicatorShadow.png);
	background-position:top center;
	background-repeat:no-repeat;
	background-size:100% 60px;
	height:60px;
	width:232px; 
}

#positionBg {
	background:-webkit-linear-gradient(top, #fff, #c1c1c1);
	-webkit-border-radius: 5px;
	border-radius: 5px;
	height:41px;
	width:172px; 
}

#position {
	background:-webkit-linear-gradient(top, #fff, #dbdbdb);
	-webkit-border-radius: 4px;
	border-radius: 4px;
	height:40px;
	width:170px; 
}

#position li {
	background-position:center center;
	background-repeat:no-repeat;
	display:inline-block;
	height:40px;
	margin:0 6px;
	width:13px;
}

.indicatorOn {
	background-image:url(../img/indicatorOn.png);
}

.indicator {
	background-image:url(../img/indicator.png);
}

/******************************************* DETAILS ******************************************/

.arrowsDetails {
	display:inline;
}
.arrowsDetails a {
	height:73px;
	margin:200px 50px 0 50px;
	width:38px;
	z-index:100;
}

.details {
	margin:0;
	overflow:hidden;
}
#sliderDetails {
	color:#666;
	font-family:omegaRegular;
	font-size:12px;
	height:600px;
}
#sliderDetails ul {
	-moz-transform: translate3d(0px, 0pt, 0pt);
  -moz-transition-duration: 0ms;
  list-style: none outside none;
}
#sliderDetails li {
	display: table-cell;
	padding-top:10px;
	vertical-align: top;
}
#sliderDetails li div {
  text-align:left;
}
#sliderDetails .portrait {
	float:left;
	width:550px;
}
#sliderDetails .icon img {
	margin-top:100px;
	width:90px;
}
#sliderDetails .text {
	display:block;
	padding-right:150px;
}
#sliderDetails .title {
	display:block;
	font-size:20px;
	margin:60px 0 10px 0;
	text-shadow:1px 1px 0px #fff;
	text-transform:uppercase;
}
.btnInstall {
	background-image:url(../img/btnInstall.png);
	display:inline-block;
	height:36px;
	margin-top:10px;
	text-align:left;
	width:159px;
}
.installLink {
	display:block;
	text-align:left;
	width:60px;
}



/******************************************* MEDIA QUERIES ******************************************/
@media only screen and (orientation : landscape) {
	body { background-image:url(../img/bg_landscape.jpg); }
	#sliderDetails .portrait { margin-left:50px; margin-top: 50px; }
	#sliderDetails .text { padding-right:150px; }
	.arrows a { margin:50px 50px 0 50px; }
	.arrowsDetails a { margin:200px 50px 0 50px; }
	.details { margin:0; }
	.gallery { margin:150px 140px 0 140px; }
	.left-transparent {
		background-image:url(../img/transparent-left.png);
		background-position: 0 1px;
		background-repeat: no-repeat;
		bottom:0;
		left:0;
		position:absolute;
		top:0;
		width:70px;
		z-index:10;
	}
	.login { margin-top:-280px; }
	.right-transparent {
		background-image:url(../img/transparent-right.png);
		background-position: 8px 1px;
		background-repeat: no-repeat;
		bottom:0;
		position:absolute;
		right:0;
		top:0;
		width:70px;
	}
}

@media only screen and (orientation : portrait) {
	body { background-image:url(../img/bg_portrait.jpg); }
	#sliderDetails .portrait { margin-left:110px; margin-top: 50px; }
	#sliderDetails .icon0 { position: absolute; top: 340px; left: 530px; }
	#sliderDetails .icon1 { position: absolute; top: 340px; left: 1300px; }
	#sliderDetails .icon2 { position: absolute; top: 340px; left: 2070px; }
	#sliderDetails .icon3 { position: absolute; top: 340px; left: 2840px; }
	#sliderDetails .text { margin-top: 0px; margin-left: 100px; width: 300px; }
	.arrows a { margin:10px 50px 0 50px; }
	.arrowshome a { margin:260px 50px 0 50px; }
	.arrowsDetails a { margin:450px 50px 0 50px; }
	.details { margin:80px 0 0 0; }
	.gallery { margin:200px 0px 0 0px; }
	.login { margin-top:-330px; }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (orientation : landscape) {
	body { background-image:url(../img/bg_landscape@2x.jpg); -webkit-background-size: 1024px 768px; }
	footer { background-image:url(../img/footer@2x.png); -webkit-background-size: 525px 81px; }
	#next { background-image:url(../img/arrowRight@2x.png); -webkit-background-size: 38px 73px; }
	#prev { background-image:url(../img/arrowLeft@2x.png); -webkit-background-size: 38px 73px; }
	.btnBack { background-image:url(../img/btnBack@2x.png); -webkit-background-size: 157px 36px; }
	.btnInstall { background-image:url(../img/btnInstall@2x.png); -webkit-background-size: 159px 36px; }
	.btnLogout { background-image:url(../img/btnLogout@2x.png); -webkit-background-size: 87px 36px; }
	.indicator { background-image:url(../img/indicator@2x.png); -webkit-background-size: 14px 14px; }
	.indicatorOn { background-image:url(../img/indicatorOn@2x.png); -webkit-background-size: 14px 14px; }
	.login { background-image:url(../img/login_screen@2x.png); -webkit-background-size: 700px 500px; }
	.login .error .btnLogin { background-image:url(../img/btnLogin@2x.png); -webkit-background-size: 69px 36px; }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2) and (orientation : portrait) {
	body { background-image:url(../img/bg_portrait@2x.jpg); -webkit-background-size: 768px 1024px; }
	footer { background-image:url(../img/footer@2x.png); -webkit-background-size: 525px 81px; }
	#next { background-image:url(../img/arrowRight@2x.png); -webkit-background-size: 38px 73px; }
	#prev { background-image:url(../img/arrowLeft@2x.png); -webkit-background-size: 38px 73px; }
	.btnBack { background-image:url(../img/btnBack@2x.png); -webkit-background-size: 157px 36px; }
	.btnInstall { background-image:url(../img/btnInstall@2x.png); -webkit-background-size: 159px 36px; }
	.btnLogout { background-image:url(../img/btnLogout@2x.png); -webkit-background-size: 87px 36px; }
	.indicator { background-image:url(../img/indicator@2x.png); -webkit-background-size: 14px 14px; }
	.indicatorOn { background-image:url(../img/indicatorOn@2x.png); -webkit-background-size: 14px 14px; }
	.login { background-image:url(../img/login_screen@2x.png); -webkit-background-size: 700px 500px; margin-top:-330px; }
	.login .error .btnLogin { background-image:url(../img/btnLogin@2x.png); -webkit-background-size: 69px 36px; }
}

