@font-face { font-family:'NettoOT-Light'; src:url(../FF_Netto_OT/NettoOT-Light.otf); }

body { position:relative; background-color:#2d2c38; width:858px; margin:0 auto; padding:0 50px 0 50px; font-family:'NettoOT-Light', Arial, sans-serif; }
/*
#header { background-color:purple; }
.xpages { background-color:pink; }
.xpage { background-color:blue; }
.pane { background-color:red; }
.pane .col { background-color:yellow; }
.xpage.home .col.about { background-color:green; }
*/
.pane { position:relative; width:858px; height:auto; overflow:hidden; }

body .xpages { position:relative; width:4290px; }
body .xpages { transition-property:left; transition-duration: 0.5s; }
body .xpages { -webkit-transition-property:left; -webkit-transition-duration: 0.5s; }
body .xpages { -moz-transition-property:left; -moz-transition-duration: 0.5s; }
body.home .xpages { left:0; }
body.about .xpages { left:-858px; }
body.works .xpages { left:-1716px;}
body.partners .xpages { left:-2574px; }
body.contact .xpages { left:-3432px; }

.popup { position:absolute; }
	.popup .left { float:left; width:15px; height:57px; background-image:url(../../img/popupleft.png); }
	.popup .middle { float:left; width:auto; height:70px; padding:14px 50px 0 20px; background:url(../../img/popupmiddletip.png) no-repeat center top; color:white; font-family:helvetica; }
	.popup .right { float:left; width:15px; height:57px; background-image:url(../../img/popupright.png); }
	.popup .info { position:absolute; right:16px; width:29px; height:57px; background:url(../../img/UITableNextButton.png) no-repeat center 8px; }
.pin { position:absolute; width:28px; height:33px; background-image:url(../../img/pin.png); }
.popup.show { transition-property:top; transition-duration: 0.5s; transition-delay: 1s; transition-timing-function: ease-out, cubic-bezier(0.5, 0.2, 0.3, 1.0); }
.popup.show { -webkit-transition-property:top; -webkit-transition-duration: 0.3s; -webkit-transition-delay: 1s; -webkit-transition-timing-function: ease-out, cubic-bezier(0.5, 0.2, 0.7, 1.0); }
.popup.show { -moz-transition-property:top; -moz-transition-duration: 0.5s; -moz-transition-delay: 1s; -moz-transition-timing-function: ease-out, cubic-bezier(0.5, 0.2, 0.3, 1.0); }
.pin.show { transition-property:top; transition-duration: 0.5s; transition-delay: 0.7s; transition-timing-function: ease-out, cubic-bezier(0.5, 0.2, 0.3, 1.0); }
.pin.show { -webkit-transition-property:top; -webkit-transition-duration: 0.3s; -webkit-transition-delay: 0.7s; -webkit-transition-timing-function: ease-in, cubic-bezier(0.5, 0.2, 0.7, 1.0); }
.pin.show { -moz-transition-property:top; -moz-transition-duration: 0.5s; -moz-transition-delay: 0.7s; -moz-transition-timing-function: ease-out, cubic-bezier(0.5, 0.2, 0.3, 1.0); }

a img { border:none; }

#header { position:relative; width:858px; height:136px; border-bottom:1px solid #393748; }
	#header .logo { margin:80px 0 0 40px; }

	#header ul.language { position:absolute; top:10px; right:0; width:858px; margin:0; padding:0; list-style-type:none; color:white; font-size:10px; }
		#header ul.language li { float:right; width:60px; height:15px; padding:0; margin:0; text-align:center; }
		#header ul.language li a { cursor:pointer; cursor:default; text-decoration:none; color:white; border-bottom:1px solid #858599; }
		#header ul.language li a:hover { color:white; border-bottom:1px solid white; }
		#header ul.language li.current { color:#858599; }
		
	#header ul.selector { position:absolute; bottom:10px; right:0; width:640px; height:66px; margin:25px 0 0 0; padding:0; text-align:right; list-style-type:none; color:white; font-size:14px; text-transform:uppercase; }
		#header ul.selector li { float:left; width:128px; height:65px; padding:0; margin:0; line-height:85px; text-align:center; text-decoration:none; color:#858599; cursor:pointer; cursor:default; }
			#header ul.selector li:hover { background:url(../../img/bullets.png) no-repeat 0 top; color:white; }
		body.home #header ul.selector li.home { background:url(../../img/bullets.png) no-repeat 0 top; color:white;}
		body.about #header ul.selector li.about { background:url(../../img/bullets.png) no-repeat -128px top; color:#0095ff; }
		body.works #header ul.selector li.works { background:url(../../img/bullets.png) no-repeat -256px top; color:#ff2b84; }
		body.partners #header ul.selector li.partners { background:url(../../img/bullets.png) no-repeat -384px top; color:#ff000e; }
		body.contact #header ul.selector li.contact { background:url(../../img/bullets.png) no-repeat -512px top; color:#ffae00; }

.xpage { float:left; width:818px; padding-left:40px; min-height:500px; height:550px; }
.xpage { -webkit-transition-property:height; -webkit-transition-duration: 0.5s; }
.xpage .col { width:25%; float:left; padding-bottom:40px; min-height:500px; cursor:pointer; cursor:default; }
.xpage .col.main { width:600px; }
.xpage .col.main > div { width:600px; display:none; }
.xpage h1 { font-weight:normal; color:white; }
.xpage h2 { font-weight:normal; color:white; }
.xpage h3 { font-weight:normal; margin:0; color:white; }
.xpage p, .xpage a { color:#858599; margin:0; margin-bottom:20px; }
	.xpage p b, .xpage a b { display:block; color:white; font-weight:normal; }
.xpage .product-section { clear:both; padding-top:30px; }

.xpage p a, .xpage li a { color:#858599; }
.xpage p a:hover, .xpage p li:hover { color:white; }

.xpage .device.want-indicator .indicatorbox { position:absolute; bottom:-20px; width:100%; height:20px; margin:0 auto; text-align:center; }
.xpage .device.want-indicator .indicatorbox .arrow { display:none; width:20px; height:20px; background:url(../../img/arrows.png) no-repeat 0 0; }
.xpage div.device.want-indicator:hover .indicatorbox .arrow { display:inline-block; }
.xpage .device.want-indicator .indicatorbox .arrow.left { background-position:0 0; }
.xpage .device.want-indicator .indicatorbox div.arrow.left:hover { background-position:0 -20px; }
.xpage .device.want-indicator .indicatorbox .arrow.right { background-position:-20px 0; }
.xpage .device.want-indicator .indicatorbox div.arrow.right:hover { background-position:-20px -20px; }
.xpage .device.want-indicator .indicatorbox .indicator { display:inline; height:20px; margin:0 16px; text-align:center; }
.xpage .device.want-indicator .indicatorbox .indicator div { display:inline-block; width:15px; height:20px; background:url(../../img/bullet_off.png) no-repeat center center; }
.xpage .device.want-indicator .indicatorbox .indicator div.selected { background-image:url(../../img/bullet_on.png); }

.xpage .product-section { clear:both; margin-top:180px; border-top:1px solid #393748; }
.xpage .product-section:first-child { margin-top:0; border-top:none; }

.xpage .product-section.android .device { float:left; position:relative; width:231px; height:399px; margin:0; padding:0; border:none; background-image:url(../../img/android.png); }
.xpage .product-section.android .screen { position:absolute; top:36px; left:35px; }

.xpage .product-section.iphone .device { float:left; position:relative; width:231px; height:381px; margin:0; padding:0; border:none; background-image:url(../../img/iphone.png); }
.xpage .product-section.iphone .screen { position:absolute; top:60px; left:35px; }
.xpage .product-section.iphone .screencast { position:absolute; top:60px; left:35px; width:160px; height:240px; text-decoration:none; }
.xpage .product-section.iphone .screencast:hover { border:none; }
.xpage .product-section.iphone .screencastimage { position:absolute; left:-1px; }

.xpage .product-section.ipad.portrait .device { position:relative; width:555px; height:705px; margin:0; padding:0; border:none; background-image:url(../../img/ipad_portrait.png); }
.xpage .product-section.ipad.landscape .device { position:relative; width:613px; height:499px; margin:0; padding:0; border:none; background-image:url(../../img/ipad_landscape.png); }
.xpage .product-section.ipad.portrait .screen { position:absolute; top:60px; left:98px; }
.xpage .product-section.ipad.landscape .screen { position:absolute; top:56px; left:64px; }
.xpage .ipad .device.want-indicator .indicatorbox { bottom:40px; }

.xpage .product-section.web .device { float:left; position:relative; width:606px; height:414px; margin:0 0 40px 0; padding:0; border:none; background-image:url(../../img/browser.png); }
.xpage .product-section.web .screen { position:absolute; top:43px; left:4px; }
.xpage .product-section.web .screencast { position:absolute; top:43px; left:4px; width:592px; height:335px; text-decoration:none; }
.xpage .product-section.web .screencast:hover { border:none; }

.xpage .product-section.player .device { float:left; position:relative; width:420px; height:349px; margin:0 34px 40px 0; padding:0; border:none; background-image:url(../../img/player.png); }
.xpage .product-section.player .screen { position:absolute; top:13px; left:10px; width:400px; height:300px; }

.xpage .product-section .device .balloon { position:absolute; left:-156px; bottom:50px; width:120px; background-color:#676589; padding:10px; z-index:3; }
.xpage .product-section .device .balloon .info { display:none; color:white; }
.xpage .product-section .device .balloon .info.selected { display:block; }
.xpage .product-section .device .balloon .info a { color:white; }
.xpage .product-section .device .balloon .tip { position:absolute; width:8px; height:15px; margin-top:-8px; right:-8px; top:50%; background-image:url(../../img/balloontip.png); }

.xpage.home { height:auto; }
body.home .pane { height:auto; }
	.xpage.home .banner { display:none; position:absolute; left:0; right:0; height:59px; line-height:59px; background-image:url(../../img/homexpagebannerbkg.png); }
	.xpage.home .banner span.breaking { color:#777; padding:0 20px 0 40px; }
	.xpage.home .banner img { vertical-align:bottom; }
	.xpage.home a { display:block; margin-bottom:20px; }
	.xpage.home a { text-decoration:none; }
	.xpage.home .col a:hover { color:#858599; }
	.xpage.home .col.about h1 { color:#0095ff; }
		.xpage.home .col.about a:hover b { color:#0095ff; }
	.xpage.home .col.works h1 { color:#ff2b84; }
		.xpage.home .col.works a:hover b { color:#ff2b84; }
	.xpage.home .col.partners h1 { color:#ff000e; }
		.xpage.home .col.partners a:hover b { color:#ff000e; }
	.xpage.home .col.contact h1 { color:#ffae00; }
		.xpage.home .col.contact a:hover b { color:#ffae00; }

.xpage.about { height:auto; }
body.about .pane { height:auto; }
	.xpage.about .col.selector h1 { color:#0095ff; }
	.xpage.about .col.selector p:hover { color:#0095ff; }
	.xpage.about .col.main h1 span { font-size:20px; color:#0095ff; }
	.xpage.about .col.main h1 span a { border-bottom:1px solid #393748; text-decoration:none; color:#0095ff; }

	.xpage.about.bigsool .col.selector p.bigsool { color:white; }
	.xpage.about.mic .col.selector p.mic { color:white; }
	.xpage.about.david .col.selector p.david { color:white; }
	.xpage.about.laurent .col.selector p.laurent { color:white; }
	.xpage.about.christo .col.selector p.christo { color:white; }
	.xpage.about.thomas .col.selector p.thomas { color:white; }

	.xpage.about.bigsool .col.main h3 { margin-top:34px; color:#0095ff; }
	.xpage.about.bigsool .col.main .bigsool { display:block; }
	.xpage.about.mic .col.main .mic { display:block; }
	.xpage.about.david .col.main .david { display:block; }
	.xpage.about.laurent .col.main .laurent { display:block; }
	.xpage.about.christo .col.main .christo { display:block; }
	.xpage.about.thomas .col.main .thomas { display:block; }

.xpage.works { height:auto; }
body.works .pane { height:auto; }
	.xpage.works .col.selector h1 { color:#ff2b84; }
	.xpage.works .col.selector p:hover { color:#ff2b84; }
	.xpage.works h3 { color:#ff2b84; margin-bottom:10px; }

	.xpage.works .col.main h1 { color:white; margin-bottom:0; }
	.xpage.works .col.main h1 a { border-bottom:1px solid #393748; text-decoration:none; color:white; }
	.xpage.works .col.main h1 span { font-size:20px; color:#ff2b84; }
	.xpage.works .col.main h1 span a { border-bottom:1px solid #393748; text-decoration:none; color:#ff2b84; }
	
	.xpage.works .col.main img.appstore { float:left; padding:0; margin:10px 0 0 0; }
	.xpage.works .col.main img.appstore.right { float:right; padding:0; margin:0 10px 20px 0; }
	.xpage.works .col.main img.appstore.left { float:left; padding:0; margin:0 0 20px 0; }
	.xpage.works .col.main p { margin-bottom:14px; }

	.xpage.works.mogwo .product-section:first-child { padding-top:0; height:324px; }
	.xpage.works.dfp-flowplayer #dfp_packshot { margin-top:110px; }
	.xpage.works.dfp-flowplayer .buynowbtn { margin-top:20px; }
	.xpage.works.adsense-flowplayer #adsense_packshot { margin-top:110px; }

	.xpage.works.terminus .col.selector p.terminus { color:white; }
	.xpage.works.mogwo .col.selector p.mogwo { color:white; }
	.xpage.works.audia1 .col.selector p.audia1 { color:white; }
	.xpage.works.all4one .col.selector p.all4one { color:white; }
	.xpage.works.weatherstationworld .col.selector p.weatherstationworld { color:white; }
	.xpage.works.weatherstationfree .col.selector p.weatherstationfree { color:white; }
	.xpage.works.niceairport .col.selector p.niceairport { color:white; }
	.xpage.works.adsense-flowplayer .col.selector p.adsense-flowplayer { color:white; }
	.xpage.works.dfp-flowplayer .col.selector p.dfp-flowplayer { color:white; }

	.xpage.works.terminus .col.main .terminus { display:block; }
	.xpage.works.mogwo .col.main .mogwo { display:block; }
	.xpage.works.audia1 .col.main .audia1 { display:block; }
	.xpage.works.all4one .col.main .all4one { display:block; }
	.xpage.works.weatherstationworld .col.main .weatherstationworld { display:block; }
	.xpage.works.weatherstationfree .col.main .weatherstationfree { display:block; }
	.xpage.works.niceairport .col.main .niceairport { display:block; }
	.xpage.works.adsense-flowplayer .col.main .adsense-flowplayer { display:block; }
	.xpage.works.dfp-flowplayer .col.main .dfp-flowplayer { display:block; }

	.xpage.works.weatherstationfree .col.main .product-section { margin-top:0px; }
	.xpage.works.weatherstationfree .col.main .product-section ol { color:#858599; }
	
	.xpage.works.weatherstationworld .col.main .product-section { margin-top:0px; }
	.xpage.works.weatherstationworld .col.main .product-section ol { color:#858599; }

.xpage.partners { height:auto; }
body.partners .pane { height:auto; }
	.xpage.partners p.title { margin-bottom:0; }
	.xpage.partners ul { color:#858599; margin-top:0; }
	.xpage.partners .col.selector h1 { color:#ff000e; }
	.xpage.partners .col.selector p:hover { color:#ff000e; }
	.xpage.partners .col.main h1 .partnerlogo { float:right; padding-left:30px; border-left:1px solid #393748; }

	.xpage.partners.partnership .col.selector p.partnership { color:white; }
	.xpage.partners.flowplayer .col.selector p.flowplayer { color:white; }
	.xpage.partners.qosmos .col.selector p.qosmos { color:white; }

	.xpage.partners .col.main { width:75%; float:left; }
		.xpage.partners .col.main h1 { color:white; }
	
		.xpage.partners.partnership .col.main .partnership { display:block; }
		.xpage.partners.flowplayer .col.main .flowplayer { display:block; }
		.xpage.partners.qosmos .col.main .qosmos { display:block; }
		
.xpage.contact { height:auto; }
body.contact .pane { height:auto; }
	.xpage.contact p { padding-bottom:20px; }
	.xpage.contact .col.selector h1 { color:#ffae00; }

	.xpage.contact .col.main { width:75%; height:500px; float:left; }
		.xpage.contact .col.main #googlemap { position:relative; width:700px; height:420px; margin-top:30px; display:block; background-image:url(../../img/map-med.jpg); background-repeat:no-repeat; }
		.xpage.contact .col.main #googlemap a { text-decoration:none; }
		.xpage.contact .col.main #googlemap .logo { position:absolute; bottom:4px; right:90px; width:69px; height:23px; background-image:url(../../img/GoogleBadge.png); z-index:1; }
		
		.xpage.contact .col.main #googlemap .popup { top:-140px; left:91px; }
		.xpage.contact .col.main #googlemap .popup.show { top:130px; left:91px; }
		.xpage.contact .col.main #googlemap .pin { top:-80px; left:220px; }
		.xpage.contact .col.main #googlemap .pin.show { top:190px; left:220px; }

	.xpage.contact #loadinggooglemap { margin:100 auto; width:80%; height:120px; -webkit-border-radius:8px; background-color:rgba(10, 10, 10, 0.2); color:white; text-align:center; font-size:18px; line-height:120px; }

#footer { clear:both; border-top:1px solid #393748; padding:10px 0 40px 40px; font-size:12px; color:#858599; }