/*
    Default Styles
*/

* { margin: 0; padding: 0; outline: 0; }
body { font: 14px/120% "Trebuchet MS",Arial,sans-serif; color: #888; text-align: left; background: #000; }


#button_mac {
    background: url('http://www.spoofapp.com/css/images/logo_mac.png') 0 0 no-repeat;
    width: 180px;
    height: 180px;
    margin: 0px auto;
    display: block;
    text-indent: 0px;
    border: none;
}

#button_mac:hover {
    background-position: -180px 0;
}

#button_mac:active {
    background-position: 0 -0px;
}

#button_2g {
    background: url('http://www.spoofapp.com/css/images/iphone2g.png') 0 0 no-repeat;
    width: 120px;
    height: 210px;
    margin: 0px auto;
    display: block;
    text-indent: 0px;
    border: none;
}

#button_2g:hover {
    background-position: -120px 0;
}

#button_2g:active {
    background-position: 0 -0px;
}

#button_3g {
    background: url('http://www.spoofapp.com/css/images/iphone3g.png') 0 0 no-repeat;
    width: 120px;
    height: 210px;
    margin: 0px auto;
    display: block;
    text-indent: 0px;
    border: none;
}

#button_3g:hover {
    background-position: -120px 0;
}

#button_3g:active {
    background-position: 0 -0px;
}

#button_3gs {
    background: url('http://www.spoofapp.com/css/images/iphone3gs.png') 0 0 no-repeat;
    width: 120px;
    height: 210px;
    margin: 0px auto;
    display: block;
    text-indent: 0px;
    border: none;
}

#button_3gs:hover {
    background-position: -120px 0;
}

#button_3gs:active {
    background-position: 0 -0px;
}

#button_windows {
    background: url('http://www.spoofapp.com/css/images/logo_win.png') 0 0 no-repeat;
    width: 180px;
    height: 180px;
    margin: 0px auto;
    display: block;
    text-indent: 0px;
    border: none;
}

#button_windows:hover {
    background-position: -180px 0;
}

#button_windows:active {
    background-position: 0 -0px;
}


a { color: #ffc50c; text-decoration: none; }
a:hover { cursor: pointer; text-decoration: underline; }
a img { border: 0; }

.fl { float: left; display: inline; }
.fr { float: right !important; display:inline; }
.ac { text-align: center; }
.ar { text-align: right; }
.al { text-align: left; }
.cl { clear: both; height: 0; line-height: 0; font-size: 0; text-indent: -4000px; }
.hidden { display: none; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }
.shell { margin: 0 auto; width: 943px; }


h2.page-title { font-size: 24px; font-weight: bold; color: #fff; margin-bottom: 35px; }
#submit { font-size: 24px; } 

/*
	Header
*/

h1#logo { float: left; display: inline; height: 105px; width: 225px; font-size: 0; line-height: 0; margin: 9px 45px 0 0; }
h1#logo a { display: block; height: 105px; background: url(images/logo.gif); text-indent: -4000px; }

#navigation { float: left; display: inline; padding: 50px 0 10px; border-bottom: 1px solid #1a1a1a; width: 673px; }
#navigation ul { float: left; display: inline; list-style: none outside; }
#navigation li { float: left; display: inline; margin-right: 20px; padding-top: 5px;  }
#navigation li.last { margin: 0; }
#navigation li a { font-size: 17px; line-height: 20px; font-weight: bold; color: #f89310; }
#navigation li a.active { color: #0077b2; text-decoration: none; }

#login { float: right !important; display: inline; width: 176px; }
#login .field { float: left; display: inline; background: #000; border: 1px solid #282828; padding: 5px 8px; width: 109px; color: #282828; font-family: "Trebuchet MS", Arial, sans-serif; }
#login .button { float: left; display: inline; color: #a2a2a2; font: bold 14px/31px "Trebuchet MS", Arial, sans-serif; margin: 0 0 0 5px; }
/*
	Homepage
*/

#content { padding-top: 35px; }

#welcome { background: url(images/homepage-phones.jpg) no-repeat right 0; padding: 30px 460px 85px 0; position: relative; }
#welcome p { font-size: 26px; line-height: 30px; font-weight: bold; color: #FFF; padding-bottom: 25px; }
#welcome a { font-size: 21px; font-weight: bold; float: left; display: inline; color: #03d125; background: url(images/homepage-pointer-green.gif) no-repeat right 3px; padding-right: 15px; margin-right: 40px; }
#welcome a:hover { background-image: url(images/homepage-pointer-green.gif); color: #03d125; text-decoration: underline; }
#welcome a.video { font-size: 21px; font-weight: bold; float: left; display: inline; color: #0077b2; background: url(images/homepage-pointer-blue.gif) no-repeat right 3px; padding-right: 15px; margin-right: 40px; }
#welcome a.video:hover { background-image: url(images/homepage-pointer-blue.gif); color: #0077b2; text-decoration: underline; }
#welcome .quote { position: absolute; top: 305px; left: 530px; font-size: 13px; text-align: center; font-weight: bold; color: #a2a2a2; width: 400px; }

#services { padding-top: 50px; }
#services ul { list-style: none outside; }
#services li { float: left; display: inline; margin: 0 40px 50px 0; width: 290px;}
#services ul.four-columns li { float: left; display: inline; margin: 0 30px 50px 0; width: 230px; }
#services li.last { margin-right: 0; position: relative; margin-right: -100px !important; }
#services h2 { font-size: 22px; color: #fff; margin-bottom: 10px; }
#services img { float: left; margin-right: 5px; }

span.boldtext { color: #f89310; text-decoration: none; }

span.titletext { color: #f89310; font-size: 22px; text-decoration: none; }
span.whitetext { color: #ffffff; font-size: 18px; text-decoration: none; }
span.descriptiontext { color: #c4c4c4; font-size: 14px; text-decoration: none; }
span.error { color: #FF0000; }

span.contactresponse { color: #000000; font-size: 14px; text-decoration: none; }

div.responsetext	{ display:none; border-style: outset; margin-left: 22px; padding: 6px;  background-color: #ffffff;  border-width:5px; }

.tb2 {
	background-color : #ffffff;
	border: 1px solid #000000;
	width: 510px;
	font-size: 22px;
}

div.spacer { height:15px; }
/*
	Main
*/

#main { float: left; display: inline; width: 665px; padding-right: 40px; }
#faq h2 { font-size: 16px; font-weight: bold; color: #fff; margin-bottom: 10px; }
#faq .question { padding-bottom: 30px; color: #c4c4c4; }

#install {}
#install .phones { margin-bottom: 25px; }
#install .phones .middle { margin: 0 120px; }

#install .install-guide,
#screenshots .phone .box { width: 674px; height: 100%; position: relative; margin-right: -9px; background: #181818; }

#install .install-guide .bottom,
#screenshots .phone .box .bottom { background: url(images/main-box-bottom.gif) no-repeat 0 bottom; }

#install .install-guide .top,
#screenshots .phone .box .top { background: url(images/main-box-top.gif) no-repeat 0 top; padding: 20px 10px; height: 100%; }

#install .install-guide h2 { font: bold 16px "Trebuchet MS", Arial, sans-serif; color: #fff; margin-bottom: 10px; }
#install .install-guide p { padding-bottom: 10px; color: #c4c4c4; }
#install .install-guide ul { padding: 0 0 20px 20px; color:#c4c4c4; }
#install .install-guide ul li a { color: #c4c4c4; }

#screenshots .phone { margin-bottom: 70px;}
#screenshots .phone h2 { color: #f89310; font-size: 24px; font-weight: bold; margin-bottom: 15px; }
#screenshots .phone .box { position: relative; }
#screenshots .phone .box .top { padding: 15px 10px; min-height: 140px; }
#screenshots .phone ul { list-style: none outside; padding-left: 137px; }
#screenshots .phone ul.blackberry { padding-top: 10px; padding-left: 147px}
#screenshots .phone ul li { float: left; display: inline; margin-right: 25px; }
#screenshots .phone ul li.last { margin: 0; }
#screenshots .phone ul li a { float: left; display: inline; }
#screenshots .phone .phone-type { position: absolute; top: -15px; left: 0; }



/*
	Sidebar
*/

#sidebar { float: right; display: inline; width: 193px; border-left: 1px solid #1a1a1a; padding-left: 42px; min-height: 500px; }
#sidebar .help-text { padding-bottom: 25px; }

#sidebar .box { background: #151413; height: 100%; margin-bottom: 25px; }
#sidebar .box .bottom { background: url(images/sidebar-box-bottom.gif) no-repeat 0 bottom; }
#sidebar .box .top { background: url(images/sidebar-box-top.gif) no-repeat 0 top; padding: 10px; padding-right: 0; }
#sidebar .box .top { font-size: 15px; }
#sidebar .box .top img { margin-right: 10px; }
#sidebar .box .top h2 { font-size: 15px; margin: 15px 0; }
#sidebar .box .top a { font-weight: bold; color: #888; text-decoration: underline;}
#sidebar .box .top a:hover { text-decoration: none; }



/*
	Footer
*/

#footer { height: 171px; background: url(images/footer-bg.gif) repeat-x 0 0; margin-top: 30px; padding-top: 30px; }
#footer h4 { color: #fff; font-size: 14px; font-weight: bold; }
#footer ul { list-style: none outside; }
#footer .column { margin-right: 40px; }
#footer a { color: #c4c4c4; font-weight: bold; }
#footer a.active { color: #0077b2; text-decoration: none; }

#footer .social { display: block; height: 23px; width: 150px; padding-bottom: 5px; color: #fff; padding-left: 30px; background-repeat: no-repeat; background-position: 0 0;   }
#footer .facebook { background-image: url(images/icon-facebook.gif); }
#footer .youtube { background-image: url(images/icon-youtube.gif); }
#footer .twitter { background-image: url(images/icon-twitter.gif); }

#footer p { font-size: 12px; color:#c4c4c4; }