html {
          overflow: -moz-scrollbars-vertical;
     }

body {
	background-image: url(/img/promo/bg_body.gif);
	background-repeat: repeat-x;
	background-color: #f0f0f0;
	color:#333333;
	font-family:"Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
	font-size:12px;
	font-size-adjust:none;
	font-style:normal;
	font-variant:normal;
	font-weight:normal;
	line-height:18px;
}


/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; }
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; }
ul,ol { list-style: none; }
fieldset,img { border: none; }
caption,th { text-align: left; }
table { border-collapse: collapse; border-spacing: 0; }

/* LAYOUT */
.clear { clear: both; }
.clearer { clear: both; display: block; margin: 0; padding: 0; height: 0; line-height: 1px; font-size: 1px; }

img.left { float: left; margin: 2px 20px 16px 0; }
img.right { float: right; margin: 2px 0 16px 20px; }
img.across { margin: 2px 0 16px 0; }
img.flushleft { margin-left: -20px; }
img.flushright { margin-right: -20px; }

#overview dl {
	line-height:1.8em;
	margin:0px;
	width:400px;
}

#overview dl dt {
	float: left;
	width: 200px;
	font-weight: bold;
}

#overview dl dd {
	margin-left: 210px;
	text-align: right;
	width: 40px;
}

/* GRID */
.column { float: left; }
.grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { width: 100%; }

.grid2col .column { width: 49%; }
.grid2col .grid2col .column { width: 47.8%; }
.grid3col .grid2col .column { width: 46%; }
.grid4col .grid2col .column { width: 45%; }

.grid2cola .column.first { width: 66%; }
.grid2cola .column.last { width: 32%; }

.grid2colb .column.first { width: 74.9%; }
.grid2colb .column.last { width: 23%; }

.grid2colc .column.first { width: 32%; }
.grid2colc .column.last { width: 66%; }

.grid2cold .column.first { width: 23%; }
.grid2cold .column.last { width: 74.9%; }

.grid2cole .column.first { width: 79%; }
.grid2cole .column.last { width: 19%; }

.grid2colf .column.first { width: 19%; }
.grid2colf .column.last { width: 79%; }

.grid3col .column { width: 32%; margin-left: 2%; }
.grid2col .grid3col .column { width: 31%; }

.grid3cola .column { width: 58%; margin-left: 2%; }
.grid3cola .column.first,
.grid3cola .column.last { width: 19%; }

.grid4col .column { width: 23%; margin-left: 3%; }

.grid5col .column { width: 18.4%; margin-left: 2%; }

.grid6col .column { width: 15%; margin-left: 2%; }

.column.first, .column.last { margin-left: 0 !important; }
.column.last { float: right !important; }

p.last, ul.last, ol.last, li.last { _width: auto !important; _float: none !important; }

#container:after, #content:after, .grid2col:after, .grid2cola:after, .grid2colb:after, .grid2colc:after, .grid2cold:after, .grid2cole:after, .grid2colf:after, .grid3col:after, .grid3cola:after, .grid4col:after, .grid5col:after, .grid6col:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#container, #content, .grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { zoom: 1; }

/* TYPE */

a { color: #08c; }
a:link, a:visited, a:active { text-decoration: none; }
a:hover { text-decoration: underline; }
a.more { white-space: nowrap; padding-right: 10px; background: url(http://images.apple.com/global/elements/arrows/morearrow_08c.gif) no-repeat 100% 50%; zoom: 1; }
a[rel="external"], a.external { white-space: nowrap; padding-right: 15px; background: url(http://images.apple.com/global/elements/icons/external10x10.gif) no-repeat 100% 50%; zoom: 1; }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
sup { padding-left: 1px; font-size: 10px !important; font-weight: normal !important; vertical-align: baseline; position: relative; bottom: 0.33em; color: #76797c; _position: static !important; }
abbr { border: 0; }
.sosumi { font-size: 10px !important; color:#76797c; }

p { margin-bottom: 18px; }
h1 { font-weight: normal; font-size: 24px; line-height: 36px; margin-bottom: 18px; }
h2 { font-weight: normal; font-size: 22px; line-height: 22px; margin-bottom:0.8em; }
h3 { font-weight: bold; font-size: 1em; line-height: 18px; }
h4 { font-weight: bold; font-size: 10px; line-height: 18px; }
p.intro { font-weight: bold; }
.more { text-align: right; }

ul { margin-bottom: 18px; list-style: none outside; }
ol { margin-bottom: 18px; list-style: decimal; margin-left: 2.2em; }
ul.square,
ul.circle { margin-left: 2em; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul ul.circle,
ul ul.square { margin-top: 4px; margin-bottom: 5px; }
ol.sosumi { margin-left: 0; padding-left: 2em; }

.callout { font-size: 11px; line-height: 18px; margin-bottom: 18px; }

.replaced { display: block; height: 10px; outline: none; overflow: hidden; text-indent: -9999px; width: 10px;  background: no-repeat 0 0; }


img {
	display:inline-block;
	vertical-align:bottom;
	border:0 none;
}

a:link, a:visited, a:active {
	text-decoration:none;
}
a {
	color:#0088CC;
}
p{
	margin-bottom:18px;
}

/* GRID */
.column { float: left; }
.grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { width: 100%; }

.grid2col .column { width: 49%; }
.grid2col .grid2col .column { width: 47.8%; }
.grid3col .grid2col .column { width: 46%; }
.grid4col .grid2col .column { width: 45%; }

.grid2cola .column.first { width: 66%; }
.grid2cola .column.last { width: 32%; }

.grid2colb .column.first { width: 74.9%; }
.grid2colb .column.last { width: 23%; }

.grid2colc .column.first { width: 32%; }
.grid2colc .column.last { width: 66%; }

.grid2cold .column.first { width: 23%; }
.grid2cold .column.last { width: 74.9%; }

.grid2cole .column.first { width: 79%; }
.grid2cole .column.last { width: 19%; }

.grid2colf .column.first { width: 19%; }
.grid2colf .column.last { width: 79%; }

.grid3col .column { width: 32%; margin-left: 2%; }
.grid2col .grid3col .column { width: 31%; }

.grid3cola .column { width: 58%; margin-left: 2%; }
.grid3cola .column.first,
.grid3cola .column.last { width: 19%; }

.grid4col .column { width: 23%; margin-left: 3%; }

.grid5col .column { width: 18.4%; margin-left: 2%; }

.grid6col .column { width: 15%; margin-left: 2%; }

.column.first, .column.last { margin-left: 0 !important; }
.column.last { float: right !important; }

p.last, ul.last, ol.last, li.last { _width: auto !important; _float: none !important; }

#container:after, #content:after, .grid2col:after, .grid2cola:after, .grid2colb:after, .grid2colc:after, .grid2cold:after, .grid2cole:after, .grid2colf:after, .grid3col:after, .grid3cola:after, .grid4col:after, .grid5col:after, .grid6col:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#container, #content, .grid2col, .grid2cola, .grid2colb, .grid2colc, .grid2cold, .grid2cole, .grid2colf, .grid3col, .grid3cola, .grid4col, .grid5col, .grid6col { zoom: 1; }


.callout { position: relative; float: left; width: 365px; padding: 14px 15px 18px 14px; background: #f0f3f5 url(http://images.apple.com/iwork/images/callout-bg-20090106.gif) repeat-x left top; border: 1px solid #dcdcdc; border-width: 2px 1px 1px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; -khtml-border-radius: 4px; zoom: 1; }
.callout:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.callout a.thumb { display: block; position: relative; float: left; margin: 8px 10px 0 8px; padding: 4px; background: url(http://images.apple.com/iwork/images/callout-thumb-bg-20090106.png) no-repeat left top; }
.callout a.thumb img { position: relative; top: -9px; left: -9px; padding: 6px 7px; z-index: 2; background: url(http://images.apple.com/iwork/images/callout-thumb-bg-20090106.png) no-repeat left top; }
.callout a.thumb span.play { cursor: pointer; display: block; position: absolute; width: 97px; height: 71px; top: 0; left: 0; z-index: 3; background: url(http://images.apple.com/iwork/images/overlay_thumb_play20090106.png) no-repeat 0 0; behavior: url(/global/scripts/lib/iepngfix.htc); }
.callout h3 { margin-left: 137px; margin-top: 0.3em; font: 16px "Myriad Pro", "MyriadPro", "Lucida Grande", "Lucida Sans Unicode", arial, verdana, sans-serif; font-weight: normal; _margin-left: 148px; }
.callout p { line-height: 1.3; margin-bottom: 0; margin-left: 137px !important; width: auto !important; _margin-left: 148px !important; }
.callout h3 + p { margin-bottom: 8px; }
.callout img.left { margin-bottom: 0; }
.callout .enlarge { display: block; position: absolute; top: -12px; left: -12px; width: 22px; height: 21px; z-index: 4; background: url(http://images.apple.com/global/elements/buttons/icon-enlarge.png) no-repeat left top; behavior: url(/global/scripts/lib/iepngfix.htc); }
.callout p a.more { *display:inline; *white-space:normal; *text-align:left; }

.callout.overview { width:121px; padding:0; margin-left:6px; border:0; zoom: 1; background:none; }
.callout.overview a.thumb { top: -9px; left: -9px; float: none; margin:0; padding:0; background: url(http://images.apple.com/iwork/images/overview-thumb-bg-20090106.png) no-repeat left top; behavior:url(/global/scripts/lib/iepngfix.htc); }
.callout.overview a.thumb img { top:0; left:0; display:block; padding:9px; background:none; }
.callout.overview a.thumb span.text { position:relative; display:block; width:160px; margin-left:-20px; text-align:center; }
.callout.overview a.thumb:hover span.text { text-decoration:underline; }
.callout.overview a.thumb span.play { position: absolute !important; top:9px; left:9px; margin:0; }

#top { min-height: 315px; padding-top:0px; z-index:0; }
#top img.flushright { position:relative; z-index:1; margin:-156px 0 0 -50px; }
#top h1 { position:relative; z-index:2; padding-top:20px;}
p.intro { color:#888888;
font-size:1.6em;
font-weight:normal;
line-height:1.3em;
margin:10px 0;
position:relative;
width:367px;
z-index:2; }

#main .grid6col { border-top: 1px solid #e4e4e4; margin: 0 auto; width: 880px; }

#content h2 { font-size:22px; line-height:22px; font-weight:normal; margin-bottom:0.8em; }

.rr { padding-top: 34px; }
.ll { padding-top: 34px; }
.ll .column.last img { margin-left:0; }

#content #theme { padding-top: 31px; }
#content #theme .column { width: 48%; }
#content #transitions { clear:both; padding-top: 54px; }
#content #connection { padding-top: 54px; }
#content #remote { padding-top: 54px; }
#content #remote .callout { max-width:370px; }
#content #remote img.flushright { position:relative; z-index:1; margin-left:-32px; }
#content #remote .column.first p { position:relative; z-index:2; }
#content #share { clear:both; padding-top: 54px; }
#content #share img.flushleft { margin-right: 20px; }

#wrapper {
	margin: 0px auto;
	text-align: left;
	width: 980px;
}

.header_content{
	border: solid #b4d68b;
	border-width: 0 0px 10px 0px;
	background-color: #dfefcb;
	padding: 0px 20px 0px 20px;
	width:940px;
	margin: 0 auto;
}

#wrapper .main_content{
	background-color: #fff;
}

.main_content{
	padding:0 50px 36px;
}
.header_wrapper{
	position: relative;
	margin: 0px auto;
	text-align: left;
	width: 980px;
}

.menu_wrapper{
	position: absolute;
	bottom: 0px;
	left: 220px;
}


div.number_button{
	background-color:#c00;
	color:#fff;
	padding: 0px 6px;
	border: solid 1px #aaa;
	font-size:.9em;
	position:absolute;
	z-index:2;
}

span.number_button{
background-color:#c00;
 color:#fff;
  padding: 2px 6px;
   margin:0 5px 0 0;
   font-size:.9em
}

#wrapper p.subscribe{
	line-height: 1em;
}

span.beta {
	font-size: 0.8em;
}

.width_100{
	width:30em;
}
input.submit {
	margin-top: 10px;
	line-height: normal;
	height: 3em;
}

input.form-error{
	border-bottom: 1px solid #4B326B;
}
div.error-message{
	margin-top: 2px;
	color: #4B326B;
}
div#flashMessage{
	background-color: #fdf7bc;
	padding: 5px 10px;
	border: 1px solid #dcd6a4;
	color:#000;
	
}


.top_nav, .top_nav_selected{
	font-size: 1.2em;
	padding: 0 0 0 10px;
	float:left;
}

.top_nav a{
	background-color: #3a3a3a;
	padding:8px 10px;
	text-decoration: none;
	color: #fff;
	display: block;
}

.top_nav a:hover{
	background-color: #7a7a7a;
	padding:8px 10px;
	text-decoration: none;
	color: #fff;
	display: block;
}

.top_nav_selected a{
	background-color: #b4d68b;
	padding:8px 10px;
	text-decoration: none;
	color: #111;
	display: block;
}


ul{
 margin:0;
 padding:0 2em;
}