/* General */

html{font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%}

body {margin:0; padding:0; text-align:center; background:#53172A;
            font-family: "Raleway","Ubuntu","Helvetica Neue","Helvetica","Arial",sans-serif;
            color: #333;font-size: 16px;
}
#topbar { text-align: left; position: absolute; top: 0px; height: 20px; z-index: 1000; background-color: rgba(165,133,145,0.3); padding: 2px 14px; border-bottom: 1px solid #867; border-right: 1px solid #867; transition: 1s;-webkit-transition: 1s;}
#topbar:hover { background-color: rgba(165,133,145,0.6); }
#topbar a, h2 a { color: #dcd; text-decoration: none;}
#topbar a:hover { color: #fef; text-decoration: underline;}
h2 {font-size: 12.5px; padding: 0; margin:5px; }
h2 a { border: 1px solid; padding: 0px 5px; border-radius: 5px; background-color: rgba(80,80,20,0.5); transition: 1s;-webkit-transition: 1s;}
h2 a:hover { color: #ee4 !important; background-color: rgba(80,80,20, 1);} 

img {border:none;}
.clear {clear:both}
.png {
        position:relative;
} 
/* base */

#landscape {background:transparent url(/images/studio_bg.png) repeat-x center top; width:100%; margin:0 auto; min-height:600px; height:auto !important; height:600px;}
#content {width:930px; margin:0 auto; padding:0; text-align:left; padding-left:80px;}

/* screen section */

#hero {float:right; width:552px; margin:265px 0 0 0;}
#monitor {background:transparent url(/images/monitor.png) no-repeat 49px 4px; width:552px; height:345px; position:relative;}
.hidden {display: none;}


/* prox */

	#slide {
		position:absolute; top:38px; left:107px;
		width:340px; height:227px; 
	}
	
	#slide ul {
		margin:0;
		padding:0;
		list-style:none;
	}
	
	#slide li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
			width:340px; 
			height:227px; 
			overflow:hidden; 
		}	
	

/* Logo, copy and app store button */

#goin-justin {float:right; width:364px; margin: 80px 0 0 0;}
#goin-justin h1 {margin:0 0 40px 0; padding:0; background:transparent url(/images/goin_justin4b.png) no-repeat 0 0; width:364px; height:130px; text-indent:-999em;}
#goin-justin h1.studio {background:transparent url(/images/dantoine_studio_logo.png) no-repeat 0 0 !important; width:664px; height:430px;}
#goin-justin p {color:#fff; margin:0 30px 21px 10px; font-size: 12.5px; line-height: 16px; }
#goin-justin a, #goin-justin a:hover, #goin-justin a:visited {color:#fff; }
a.twitter, a.twitter:hover, a.twitter:visited {text-decoration: none; font-size: 10px; line-height: 12px; }
#goin-justin p.twit_spacer {padding-top: 8px;}
#goin-justin a.twitter strong { color: #aef; }
#goin-justin a.twitter, #goin-justin a.twitter:hover, #goin-justin a.twitter:visited {color:#aa6 !important;}
#goin-justin a#btnzxStore {margin:30px 0 0 110px; padding:0; display:block; background:transparent url(/images/zx_store.png) no-repeat 0 0; width:253px; height:117px; text-indent:-999em;}

#infotext {
  font-size: 11px;
  text-align: justify;
  height: 152px;
  overflow: auto;
}
/* other down section */

#downloads { position: relative; padding-left:120px;}
#downTitles {  margin-left:-30px; position:relative;}
#down{ float:left; margin-left:175px; margin-right:250px;}
#down2{ float:left; }

#downloads .icon-item { background: transparent; padding: 0 6px; float: left; margin: 0px 5px 0 0; position: relative; }
#downloads .space {margin-right:30px;}
#downloads .icon-item a { display: block; }
#downloads .icon-item.last { margin-right: 0px; }
		
	.project-popup { display: none; position: absolute; top: -200px; left: -141px; padding: 7px 0 0 7px; z-index: 1000 !important; }
	.project-popup span { background: url(/images/overlay.png) no-repeat; position: absolute; top: 0px; left: 0px; z-index: 5; display: block; width: 219px; height: 138px;}
	.project-popup a { display: block; }

/* Footer */

#footer {text-align:center; padding-top:15px; color: #fff; font-size: 10px;}
#footer a {color: #fff; height:20px; width:505px; margin:0 auto; text-decoration: none;}

#social_content { position: fixed; top:0;  width: 100%; height: 100%; background-color: rgba(255,255,255,0.2); cursor:pointer; }
#social_content div#social_border { background-color: rgba(255,255,255,0.8); color: #884; height: 400px; border: 1px solid; border-radius: 15px; width: 80%; height: 80%; margin: 60px auto; overflow: auto;}
#social_content p { margin-top: 5%; }
#social_content ul { text-align: left; }
#social_content h2 { font-size: 25px; color: #542; }
#social_content span.video-name {display: block; margin: 30px 0px 10px 0px; font-weight: bold; font-size: 20px;}
#social_content iframe { width: 640px; height: 480px; }
#social_content a {color: #664; font-size: 16px; font-weight: bold;}

#players_cites { position: absolute; color: #fea; width: 400px;  margin: 100px 0 0 0; padding: 0 80px;}
#players_cites cite { display: block; padding: 20px 0px; font-size: 13px; cursor: default; }
#players_cites cite strong { font-size: 400%; line-height: 0px; padding:0; margin:0; }
#players_cites cite span { font-size: 10px; display: block; }