/* 
screwtape_mobile.css
Copyright 2009, Focus on the Family
Created: 9/12/09
Version: 1.0
*/

/* html */
body { background-color:#000000; background-image:none; }
img { border:none; }
.topMargin { margin-top:10px; }
.rightMargin { margin-right:10px; }
.bottomMargin { margin-bottom:10px; }
.leftMargin { margin-left:10px; }
.clear { font-size:1px; overflow:hidden; clear:both; height:1px; }
a { outline:none; border:none; }

img.left { float:left; }
img.right { float:right; }

/* main layout divs */

#container { background:url(../images/mobile/content_bg.gif) 0 219px no-repeat; width:500px; margin:0; overflow:visible; }
#header { height:90px; width:500px; margin:0 auto; overflow:hidden; clear:both; padding:0; }

#editorialWell { background:url(../images/mobile/edwell_bg.png) repeat; width:500px; clear:both; overflow:hidden; padding:0; margin:14px 0 0 0; }

#content { clear:both; overflow:visible; margin:0 auto; width:500px; background:none; }
#nav { height:108px; padding:20px 0 0 0; overflow:visible; width:90%; border-top:1px solid white; margin:0 auto; clear:both; text-align:center; }

#adRow { height:auto; overflow:hidden; background:url(../images/mobile/edwell_bg.png) repeat; margin:0; width:500px; clear:both; padding:0; }
#footer { color:#fff; font-size:10px; width:500px; padding:10px 0 50px 0; font-family:Arial, Helvetica, sans-serif; margin:0; text-align:center; }

/* header styles */
#header h2,
#header h3,
#header h4 { margin:0; float:left; }

#header a { font-size:1px; text-indent:-9999px; display:block; }

#header h4 a { display:block; width:110px; height:102px; background:url(../images/mobile/logo_bg.png) no-repeat; position:relative; z-index:1; top:-50px; left:110px; }
#header h4 a:hover,
#header h4 a:focus,
#header h4 a:active { background-position:0 -102px; }

#header h2 a { width:380px; height:50px; background:url(../images/mobile/thescrewtapeletters_bg.png) no-repeat; position:relative; z-index:2; top:5px; left:5px; }
#header h2 a:hover,
#header h2 a:focus,
#header h2 a:active { background-position:0 -50px; }

#header h3 { display:block; font-size:1px; text-indent:-9999px; width:220px; height:27px; background:url(../images/mobile/tagline_bg.png) no-repeat; margin:7px 0 0 55px; }

/* nav styles */
#nav ul { list-style:none; margin:0; padding:0 0 0 15px; text-align:center; }
#nav li { display:inline; float:left; margin:0 auto; }
#nav a { display:block; outline:none; width:82px; height:86px; font-size:1px; text-indent:-9999px; background:url(../images/mobile/navtwo.png) no-repeat; margin:-30px 20px 0 20px; }
#nav a#home:hover,
#nav a#home:focus { background-position:0 -89px; }
#nav a#home:active { background-position:0 -178px; }
#nav a#home.selected,
#nav a#home.selected:hover { background-position:-20px -274px; }

#nav a#about { width:145px; background-position:-82px 0; }
#nav a#about:hover,
#nav a#about:focus { background-position:-82px -89px; }
#nav a#about:active { background-position:-82px -178px; }
#nav a#about.selected,
#nav a#about.selected:hover { background-position:-82px -384px; }

#nav a#share { width:72px; background-position:-227px 0; }
#nav a#share:hover { background-position:-227px -89px; }
#nav a#share:active { background-position:-227px -178px; }
#nav a#share.selected,
#nav a#share.selected:hover { background-position:-227px -275px; }

#nav a#downloads { width:165px; background-position:-299px 0; }
#nav a#downloads:hover { background-position:-299px -89px; }
#nav a#downloads:active { background-position:-299px -178px; }
#nav a#downloads.selected,
#nav a#downloads.selected:hover { background-position:-299px -390px; }

#nav a#orderNow { width:111px; background-position:-464px 0; }
#nav a#orderNow:hover { background-position:-464px -89px; }
#nav a#orderNow:active { background-position:-464px -178px; }
#nav a#orderNow.selected,
#nav a#orderNow.selected:hover { background-position:-438px -272px; }

/* order box styles */
#orderBox h4 { margin:0; }
#orderBox h4 a { display:block; width:200px; height:300px; font-size:1px; text-indent:-9999px; background:url(../images/siteelements/boximage.png) no-repeat; margin:15px 0 0 20px; }
#orderBox h4 a:hover { background-position:0 -300px; }

/* editorialWell styles */
.boxOne,
.boxTwo,
.boxThree,
.boxFour,
.boxFive,
.boxSix { width:90%; float:none; margin:6px auto; background:url(../images/mobile/box_bg.png); overflow:hidden; height:auto; }

.columnOne,
.columnTwo { width:500px; float:none; clear:both; overflow:hidden; }

.boxOne .content,
.boxTwo .content,
.boxThree .content,
.boxFour .content,
.boxFive .content,
.boxSix  .content { height:auto; background:none; padding:10px; width:90%; font-family:Arial, Helvetica, sans-serif; font-size:9px; }

.firstBox { margin:6px auto; width:90%; height:auto; float:none; }

.column { margin:0; clear:both; width:90%; padding:0; }

h1.smudger,
h2.smudger,
h3.smudger { font-family:Georgia, "Times New Roman", Times, serif; margin:0 0 6px 0; font-size:18px; color:#880101; height:30px; }
h2.smudger { font-size:14px; }
h3.smudger { color:black; font-size:12px; height:18px; font-style:italic; }

#editorialWell a { font-weight:bold; color:#880101; height:24px; }
#editorialWell a:hover { color:#000000; text-decoration:none;  }


a.twitFollow { display:block; margin:3px 6px; }
a.twitFollow:before { content:"> "; text-decoration:none; color:#000000; }
a.twitFollowShow { display:block; }

.banners { text-align:center; }
.banners img { display:block; float:none; margin:0 auto 6px auto; }

.ringtone { margin:0; overflow:hidden; clear:both; width:185px; }
ul.downloadLinks { margin:0 0 20px 20px; padding:0 0 0 0; }
.downloadlinksRight { float:left; width:80px; list-style:none; }
.downloadLinks a { font-weight:bold; font-size:11px; color:#880101; }
.downloadLinks a:hover { color:#000000; text-decoration:none; }
.downloadlinksRight li { width:80px; margin:0; padding:0; text-indent:0;  }

.icons img { float:left; margin:15px; }

#intro { display:block; }

#bioBox #text0,
#bioBox #text1,
#bioBox #text2,
#bioBox #text3,
#bioBox #text4,
#bioBox #text5,
#bioBox #text6,
#bioBox #text7,
#editorialWell #bioBox .text  { display:block; height:auto; position:relative; clear:both; top:0; left:0; clear:both; }
#editorialWell #bioBox .text  { margin:0 12px 0 0; }

#bioBox { width:351px; display:block; height:auto; float:none; overflow:visible; position:relative; top:0 !important; left:0 !important; z-index:9999; }

a.orderNow { font-size:1px; width:227px; height:78px !important; display:block; text-indent:-9999px; background:url(../images/backgrounds/order_button.png) 0 -168px no-repeat; margin:0 0 0 10px; }

a.orderNow:hover { background-position:0 -258px; }

#container #internationalButtons { overflow:hidden; text-align:center; padding-left:10px; width:90%; }

#container #internationalButtons ul { list-style:none; margin:0; width:100%; padding:0; }
#container #internationalButtons ul li { display:inline; margin:0; padding:0; width:227px; overflow:hidden; }
#container #internationalButtons ul li a { font-size:1px; width:227px; height:78px; display:block; text-indent:-9999px; margin:5px 0 5px 86px; }

#container #internationalButtons li.orderCanada a { background:url(../images/backgrounds/order_button_canada.png) 0 0 no-repeat;  }
#container #internationalButtons li.orderCanada a:hover { background-position:0 -90px; }

#container #internationalButtons li.orderAustralia a { background:url(../images/backgrounds/order_button_australia.png) 0 0 no-repeat;  }
#container #internationalButtons li.orderAustralia a:hover { background-position:0 -90px; }

#container #internationalButtons li.orderNewZealand a { background:url(../images/backgrounds/order_button_newzealand.png) 0 0 no-repeat; margin-left:86px; }
#container #internationalButtons li.orderNewZealand a:hover { background-position:0 -90px; }

p { margin:0 0 15px 0; }

.adBox { clear:both; float:none; margin:6px auto; }

/* items to hide */
#wrapperOne,
#wrapperTwo,
iframe,
img#shareImage,
#orderBox,
#topSlot,
.skipNav,
.flashContainer,
.hiddenContent,
.twitBox,
.ringtone,
.listen,
.bookmarks { display:none; }