/* ---------------------------------------------------------------------------------
Brainflash stylesheet
--------------------------------------------------------------------------------- */


body { margin: 0; padding: 0; width:100%; background: #000; color:white; 
		font-family: "Calibre", "Helvetica Neue", "Helvetica", sans-serif;  }

p { font-size: 1.2em; color:white; line-height: 1.4em; margin: 0 0 1.2em 0; }
p a { color: #00ffdf; }
/* p a { color: #0d80d1; } */
p a:hover, h4 a:hover { color: #772323; }
p em { color: #005699; }
a img { border: none; }

#topbar { position: absolute; width: 100%; top: 0px; }
#topbar { top: 0px; height: 128px; background: url(../images/bg-topbar.gif) repeat-x 0 0 #0186e6; }

#header-wrap,
#content-wrap,
#footer-wrap
{ width: 100%; position: relative; }

#header-wrap { height: 240px; }
#content-wrap { }
#footer-wrap { float: left; }

#styleSwitch { float: right; padding: 10px 20px 0 0; }
#styleSwitch a { color: #9bdcfe; font-size: 0.90em; }
#noShow { background: url(../images/hide-header.gif) no-repeat right 2px; display: block; width: 101px; height: 26px; text-indent: -5000px; }
#noShow:hover { background-position: 0px -24px; }
#showH { display: none; }

.normal { font-size: 1.2em; }
.subtitle { font-size:0.9em; }
.normal-case { text-transform:none; }

.portfolio-group { width:100%; float:left; padding-bottom:20px; }
.portfolio-icon { width:100px; float:left; padding:5px; text-align:center; color:#fff; border:0; }
.portfolio-icon a { font-size:0.8em; font-weight:bold; font-family: Arial, Helvetica, sans-serif; color:#00ffdf; text-decoration:none; }
.portfolio-icon a img { border:0; }

/*
---------------------------------------------------------------------------------
COLUMNS
--------------------------------------------------------------------------------- */
#left-column-news { width: 300px; height:175px; float:left; }
#right-column-news { width: 600px; height:175px; float:right; }

#left-column { width: 300px; float:left; }
#right-column { width: 600px; float:right; }
#middle-column { padding-left:300px; width: 300px; float:left; }

#left-column-product { width: 340px; float:left; }
#right-column-product { width: 560px; float:right; }

#left-column-ipad { width: 500px; float:left; }
#right-column-ipad { width: 400px; float:right; }

#left-column-support { width: 500px; float:left; }
#right-column-support { width: 400px; float:right; }

#left-column-devguide { width: 700px; float:left; }
#right-column-devguide { width: 180px; float:right; }



/* 
---------------------------------------------------------------------------------  
CONTENT
--------------------------------------------------------------------------------- */

.iphone { position: relative; background: url(../images/iphone/iphone.png) transparent no-repeat top left; width: 297px; height: 633px; left: 0px; top: 0px; }
.ipad { position: relative; background: url(../images/ipad/ipad.png) transparent no-repeat top left; width:446; height:400px; left: 0px; top: 0px; }
.portfolio-text { float:left; padding-right:20px; }
.portfolio-text p { padding-right:20px; }

.blog-header { font-family: Futura, Arial, Helvetica, sans-serif; font-size:100%; }
.white-rounded { color:black; background-color:white; margin: 40 40 40 40;
	-moz-outline-radius:20px; -moz-box-sizing:content-box; -moz-outline-style:solid; -moz-outline-color:white; -moz-outline-width:10px; }
.header-text { float: right; display:inline; padding: 35px 350px 0 0; }
.header-text-oneline { float: right; display:inline; padding: 55px 350px 0 0; }

/* jQuery Cycle styles */
#screenshots { position:relative; width:240px; height:345px; padding:0; margin:0; border:0; left:27px; top:105px; } 
#screenshots img { padding:0; border:0; width:240px; height:345px; }
#screenshots-ipad { position:relative; width:360px; height:263px; padding:0; margin:0; border:0; left:43px; top:47px; } 
#screenshots-ipad img { padding:0; border:0; width:360px; height:263px; } 


#header-product-details { float:left; width: 960px; min-height:170px; background: url(../images/bg_app_details.jpg) 0px 10px no-repeat #000; }
#header-blog { float:left; width: 960px; min-height:350px; background: url(../images/bg_blog.png) 0px 10px no-repeat #000; }

#subH1 { font-size:1.2em; font-weight:500; color: #fff; }
.hdivider { border-bottom: solid 2px #0d80d1; padding-top: 15px; margin-bottom: 10px; margin-right:20px; }
.hdivider-black { border-bottom: solid 1px black; padding-top: 15px; margin-bottom: 10px; }

#menu-wrap { float: left; width: 210px; margin-left:25px; padding: 50px 0 0 10px; }
#left { float: left; width:210px; padding: 20px 0 0 10px; }
#left .transparent { float:left; padding: 20px 0 0 10px; }
#left ul { float: left; margin: 0; padding: 0; padding-bottom: 20px; opacity: 1.0; }
#left ul li { float:left; list-style-type: none; padding: 0 0 1px 0; text-transform: uppercase; font-size: 1.0em; font-weight:500; text-indent: 4px; }
#left ul li .first { border-top: solid 1px white; }
#left ul li .transparent { color: black; border-color: black; }
#left ul li a { color: white; text-decoration: none; float: left; display: block; width: 210px; padding: 7px 0px; border-bottom: solid 1px white; }
#left .transparent ul li a { color: black; text-decoration: none; float: left; display: block; width: 210px; padding: 7px 0px; border-bottom: solid 1px black;}
#left ul li a:hover { background: #0d80d1; color: #fff; }

#right { float:right; padding: 0px 15px 60px 0; }
#right .marginB { margin-bottom: 1.0em; }
#right ul { margin: 0 0 1.0em 0; padding: 0; }
#right ul li { list-style-type: none; font-size: 1.2em; color: white; line-height: 1.4em; padding-left: 25px; }
#right ul li a { color: #0d80d1; }
#right ul li a:hover { color: #772323; }
#right a img:hover { background: #0d80d1; }

.contactform input, textarea { background:#989898; border: 1px; font-family:Courier; font-size:1.2em; font-weight:normal;  vertical-align:top; }
.contactform input:hover, textarea:hover { background-color:#c8c8c8; }

.contactformRequest,
.contactform input[type="submit"] { color:#000; background-color:#0ff; padding:15px; font-size:1.2em; border-radius: 12px; }
.contactformRequest:hover,
.contactform input[type="submit"]:hover { color:#000; background-color:#0cc; padding:15px; }

/*
---------------------------------------------------------------------------------  
FOOTER
--------------------------------------------------------------------------------- */
#footer { height: 140px; color: #947d5b; }
#footer-text { padding: 24px 0px; }
#footer p { margin: 10px 0 0 10px; color: #937c59; display: inline; font-size: 0.75em; }
#footer a { color: #947d5b; }
#footer a:hover { color: #61523d; }