@charset "utf-8";
* { padding:0; margin:0; }
*:focus {
    outline: 0;
}

body {
	min-width:320px;
	font-family: 'Gentium Basic', serif;
	font-size:18px;
	color:#FFF;
	background-color:#000;
	background-image:url(gfx/bg-aamfp.jpg);
	background-position:center top;
	background-repeat:no-repeat;
	background-attachment:fixed;
	
	background-size: 100% auto;
	
	overflow-y:scroll;
	
	padding-bottom: 52px;
	
}

a { color:#FFF; }

img { border:0}

.cf { clear:both; float:none }

.border-box {  padding:30px; background-color:rgba(0,0,1,0.8); border-radius: 8px; border:#333 solid 1px; box-shadow:#333 0 0 16px }

#header { height:150px;  padding:10px 10px 10px 10px; margin-bottom:10px; text-align:center; background-position:0px 0px;  background-image:url(gfx/header-cover.jpg);}

#header h1 { background-image:url(gfx/logos.png); background-repeat:no-repeat; background-position:left 110px }

#header img { position:relative; top:-10px  }

#header.info { background-image:url(gfx/header-city.jpg); }
#header.media { background-image:url(gfx/header-teaser.jpg); }
#header.buy { background-image:url(gfx/header-tunnels06.jpg); }


#content p { margin-bottom: 36px }
#content h3 { margin-bottom: 36px; text-align:center; }

#content.buy .shop { background-color: #333; padding:16px; border-radius:8px; margin-bottom:10px; text-align:center }
#content.buy .shop h3 { text-align:left; color:#999; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; text-shadow:1px 1px #000; padding-bottom:8px; margin-bottom:8px; border-bottom:1px solid  #4E4E4E; background-position:right center; background-repeat:no-repeat }

#content.buy .win-mac-linux h3 { background-image:url(gfx/win-mac-linux.png) }
#content.buy .win-mac h3 { background-image:url(gfx/win-mac.png) }
#content.buy .mac h3 { background-image:url(gfx/mac.png) }
#content.buy .win h3 { background-image:url(gfx/win.png) }

#content.buy .shop iframe { display:block; margin:auto; }

#content.buy .shop a.nowidget { display:none }


#content ul { list-style:circle;font-family:Arial, Helvetica, sans-serif; font-size:14px }
#content ul li { margin-bottom:20px }




#content.info, #content.index { border:0; padding:0; background:none; box-shadow:none }

.col-r, .col-l { float:left }

#content .col-l { width:535px; margin-right:10px; margin-bottom:10px }
#content .col-r { width:230px }


div#content.index .col-l { width:535px; height:420px; margin-right:10px; }
div#content.index .col-r { width:230px; height:420px; margin-bottom:10px; font-size:16px }

#content .specs { width:230px; font-family:Arial, Helvetica, sans-serif; margin-top:10px; min-height:500px }
#content .specs h3 {text-align:left}
#content .specs ul { list-style:none; }

#content.buy .col-l { margin-right:70px; margin-bottom:10px }
#content.buy .col-r {  }

#content.buy .specs { min-height:inherit; margin-bottom:20px; max-width:400px  }
#content.buy .specs ul { font-size:10px; text-transform:uppercase }
#content.buy .specs ul li { margin-bottom:10px }


#content.buy .specs h3 {text-align:left; font-size:14px; margin-bottom:10px; text-transform:uppercase}




#content.index .footnote { padding-top:4px; padding-bottom:4px; text-align:center }
#content.index .footnote a { color:#FFF; text-decoration:none }

#container { width:900px; margin:40px auto; }

#navi { padding:10px 30px 10px 30px; margin-bottom:10px; text-align:center }



#navi a { font-size:24px; display:inline-block; padding:0 5% 0 5%; border-right:1px #333 solid; font-weight:bold; text-transform:uppercase; text-decoration: none; color:#FFF; transition:0.2s all  }

#navi a.last { border:0 }

#navi a:hover, #navi a.active { color:#C30;  }

#footer { padding:8px; position:fixed; bottom:0; left:0; right:0; background-color: rgba(0, 0, 0, 0.5); text-align:right;   }

#footer a { margin:20px }


#content.media h2 { text-transform:uppercase; color:#999; margin-bottom:20px; text-shadow:1px 1px 1px #900; text-align:center }

.gallery { margin-bottom:40px } 

.gallery a { display:block; float:left; width:25% }
.gallery a img { width:100%; height:auto }


#gal-overlay { background-color:rgba(0,0,0,0.5); position:fixed; top:0; left:0; right:0; bottom:0; }
#gal-overlay img { width:100%; max-width:1280px; height:auto; box-shadow:0 0 20px #000, 0 0 20px #000, 0 0 20px #000;}
#gal-overlay img.portrait { height:100%; max-height:720px; width:auto; }

#gal-overlay.concept img { width:100%; max-width:900px; height:auto; box-shadow:0 0 20px #000, 0 0 20px #000, 0 0 20px #000;}
#gal-overlay.concept img.portrait { height:100%; max-height:720px; width:auto; }


#gal-overlay table { width:100%; height:100% }
#gal-overlay table td { vertical-align:middle; text-align:center }

#master_bar { background-color: rgba(42, 42, 42, 0.7); text-align: left; height: 24px; padding-top: 3px; padding-bottom: 3px; padding-left: 7px;     border-bottom: 1px solid rgb(58, 58, 58); position: fixed; top:0; left:0; right:0; z-index:999 }

#mb_span_1 { float: left; padding-right: 5px; margin-right: 5px; border-right: 1px solid rgb(58, 58, 58); }
#mb_span_2 { float: left; padding-right: 5px; margin-right: 5px; border-right: 1px solid rgb(58, 58, 58); }

.lang a { width:24px; height:24px; background-color:#333; border-radius:4px; display:block; float:left; margin-right:4px; transition:all 1s }
.lang a img { margin: 7px auto; display:block }
.lang a:hover, .lang a.active { background-color:#666 }


@media (max-width: 1700px) {

body {
background-size: auto 100%;
}	
	
}

@media (max-width: 960px) {

#container { width: 100%; padding:0; margin:0 }

div#content.index .col-r, 
div#content.index .col-l,
div#content .col-r, 
div#content .col-l { 
	width: auto; margin-right:0; margin-left:0; float:none; height:auto; min-height:inherit 
}

#content .specs { min-height: inherit; height:auto }

body { padding-top:28px }
	
}

@media (max-width: 750px) {

.gallery a { width:50% }	
#content.buy .shop iframe { display:none }
#content.buy .shop a.nowidget { display:block }	


	
}

@media (max-width: 480px) {

#master_bar { position:static; min-height:50px; top:auto; left:auto; right:auto; margin-bottom:5px  }	

body { padding-top:0 }	
#content.buy .shop img { width:100%; height:auto }	
}