html, body { width: 100%; height: 100%; }
body { background: url("/images/background.gif") repeat-x #ec018a; margin: 0px; padding: 0px; text-align: center; font-family: Lucida Grande, Tahoma, Arial, Helvetica, sans-serif; font-size: 11px; color: #fff; }
input, select, textarea { padding: 2px; margin: 2px 0px; font-family: "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; font-size: 11px; border: 1px solid #ccc; text-align: left;}
input.checkbox { border: none; }
img { border: 0px; }
form label b { color: #f00; }

#pixel-container { position: relative; margin: 0px auto; width: 960px; text-align: left; }
#pixel-bg { position: absolute; left: -390px; top: 85px; background: url("/images/home-eboy-godzilla.png")  no-repeat transparent; width: 504px; height: 660px; z-index: 10; }
#pixel { position: absolute; top: 205px; right: -70px; background: url("/images/home-eboy-dancers.png") no-repeat transparent; width: 596px; height: 352px; z-index: 10; }

#container { margin: 0px auto; width: 960px; text-align: left; z-index: 9; }

#header { position: relative; height: 125px; margin: 0px; padding: 0px; }
#header #logo { position: absolute; top: 45px; }
#header #free { position: absolute; top: 17px; right: 100px; }
#header #login { position: absolute; top: 0px; right: 0px; }
#header #login a { display: block; width: 90px; height: 36px; background: url("/images/login.png") no-repeat; text-decoration: none; }
#header #login a i { visibility: hidden; }
#header #login a:hover { background: url("/images/login-over.png") no-repeat; }
#header #logout { position: absolute; top: 0px; right: 0px; }
#header #logout a { display: block; width: 90px; height: 36px; background: url("/images/logout.png") no-repeat; text-decoration: none; }
#header #logout a i { visibility: hidden; }
#header #logout a:hover { background: url("/images/logout-over.png") no-repeat; }
#header #use-brightbook { position: absolute; top: 0px; right: 90px; }
#header #use-brightbook a { display: block; width: 146px; height: 36px; background: url("/images/use-brightbook.png") no-repeat; text-decoration: none; }
#header #use-brightbook a:hover { background: url("/images/use-brightbook-over.png") no-repeat; }
#header #use-brightbook a i { visibility: hidden; }
#header #no-eggheads { position: absolute; top: 85px; right: 0px; font-size: 18px; color: #fff; font-family: Georgia, Times, "Times New Roman", serif; font-weight: bold; width: 400px; text-align: right; }
#header #backgrounds { position: absolute; top: 5px; right: 240px; }
#header #backgrounds a { display: block; float: left; width: 24px; height: 23px; text-decoration: none; margin-right: 5px; }
#header #backgrounds .pink-on a { background: url("/images/pink-on.png") no-repeat center center; }
#header #backgrounds .pink-off a { background: url("/images/pink-off.png") no-repeat center center; }
#header #backgrounds .pink-off a:hover { background: url("/images/pink-on.png") no-repeat center center; }
#header #backgrounds .grey-on a { background: url("/images/grey-on.png") no-repeat center center; }
#header #backgrounds .grey-off a { background: url("/images/grey-off.png") no-repeat center center; }
#header #backgrounds .grey-off a:hover { background: url("/images/grey-on.png") no-repeat center center; }

#menu {}

#nav { list-style: none; margin: 0px; padding: 0px; font-weight: bold; line-height: 28px; font-size: 12px }
#nav ul { list-style: none; margin: 0px; padding: 0px; }
#nav li { float: left; padding: 0px; margin: 0px 1px 0px 0px; }
#nav a { text-decoration: none; display: block; float: left; color: #fff; }
#nav .selected a { background: url('/images/nav-c.png') left top repeat-x; color: #000; }
#nav .unselected a:hover { background: url('/images/nav-c-over.png') left top repeat-x; }
#nav span.left { display: block; height: 28px; width: 4px; overflow: hidden; float: left; }
#nav span.middle { display: block; float: left; padding: 0px 10px; }
#nav span.right { display: block; height: 28px; width: 4px; overflow: hidden; float: left; }
#nav .selected span.left { background: url('/images/nav-l.png') left top repeat-x; }
#nav .unselected a:hover span.left { background: url('/images/nav-l-over.png') left top repeat-x; }
#nav .selected span.right { background: url('/images/nav-r.png') left top repeat-x; }
#nav .unselected a:hover span.right { background: url('/images/nav-r-over.png') left top repeat-x; }

#contentbreak { background: #fff200; line-height: 30px; }

#contentcontainer { background: #fff; padding: 20px 20px 0px 20px; }

#content #main-home { position: relative; float: left; width: 700px; margin-right: 20px; background: url("/images/small-background.png") repeat-x top #ec018a; padding: 0px; z-index: 9; }
#content #main-home .tl { background: url("/images/white-tl.png") no-repeat top left; }
#content #main-home .tr { background: url("/images/white-tr.png") no-repeat top right; }
#content #main-home .bl { background: url("/images/white-bl.png") no-repeat bottom left; }
#content #main-home .br { background: url("/images/white-br.png") no-repeat bottom right; }
#content #main-home .inner { padding: 20px; height: 404px; }
#content #main-home h1 { font-size: 35px; font-weight: bold; margin: 0px; padding: 0px; color: #fff; font-family: Georgia, Times, "Times New Roman", serif; }

#content #main-home #use-brightbook-for-free { position: absolute; left: 20px; bottom: 20px; z-index: 99; }

#content #left { position: relative; float: left; width: 200px; margin-right: 20px; padding: 0px; }
#content #left #secnav { border-top: 1px solid #eee; border-left: 1px solid #eee; border-right: 1px solid #eee; margin: 0px 0px 20px 0px; padding: 0px; list-style: none; }
#content #left #secnav li { padding: 0px; margin: 0px; border-bottom: 1px solid #eee; }
#content #left #secnav li a { display: block; text-decoration: none; color: #666; padding: 10px; font-size: 12px; font-weight: bold; width: 178px; }
#content #left #secnav li a:hover { background: #f5f5f5; }
#content #left #secnav .sel a, #content #left #secnav .sel a:hover { background: url("/images/bg-gradient2.gif") repeat-x bottom; color: #000; }
#content #left #secnav .primary a { font-size: 13px; }

#content #main { position: relative; float: left; width: 480px; margin-right: 20px; padding: 0px; }
#content #main .inner { padding: 0px; border-left: 1px solid #eee; border-right: 1px solid #eee; margin: 0px 0px 20px 0px; background: url("/images/bg-gradient2.gif") repeat-x bottom; }
#content #main h1 { font-size: 20px; font-weight: bold; margin: 0px; padding: 0px; color: #fff; font-family: Georgia, Times, "Times New Roman", serif; }

#content #main .heading { background: #ec018a; margin: 0px; }
#content #main .heading .l { background: url("/images/white-tl.png") no-repeat top left; }
#content #main .heading .r { background: url("/images/white-tr.png") no-repeat top right; }
#content #main .heading h1 { padding: 20px; margin: 0px; }

#content #main .inner .item { border-bottom: 1px solid #eee; padding: 10px; }
#content #main .inner .item .left { float: left; width: 130px; margin-right: 20px; padding: 10px; }
#content #main .inner .item .left h2 { font-size: 15px; font-weight: bold; margin: 0px; padding: 0px; color: #000; font-family: Georgia, Times, "Times New Roman", serif; background: #fff; }
#content #main .inner .item h2 { font-size: 15px; font-weight: bold; margin: 0px 0px 20px 0px; padding: 10px; color: #000; font-family: Georgia, Times, "Times New Roman", serif; background: #f5f5f5; }
#content #main .inner .item h3 { font-size: 15px; font-weight: bold; margin: 20px 0px; color: #000; font-family: Georgia, Times, "Times New Roman", serif; background: #fff; }
#content #main .inner .item .right { float: left; width: 288px; background: #f5f5f5; }
#content #main .inner .roundbox { background: #f5f5f5; }
#content #main .inner .tl { background: url("/images/grey-tl.png") no-repeat top left; }
#content #main .inner .tr { background: url("/images/grey-tr.png") no-repeat top right; }
#content #main .inner .bl { background: url("/images/grey-bl.png") no-repeat bottom left; }
#content #main .inner .br { background: url("/images/grey-br.png") no-repeat bottom right; }
#content #main .inner .in { padding: 10px; }
#content #main .inner .item p { margin: 0px 0px 12px 0px; font-size: 11px; color: #666; line-height: 18px; }
#content #main .inner .item {}
#content #main .inner .item p a { color: #666; text-decoration: none; font-weight: bold; }
#content #main .inner .item label { color: #000; font-weight: bold; line-height: 22px; padding: 4px; }
#content #main .inner .item input { color: #666; font-size: 13px; padding: 4px; }
#content #main .inner .item select { color: #666; font-size: 13px; padding: 4px; }
#content #main .inner .item textarea { color: #666; font-size: 13px; padding: 4px; }

#content #main .inner .form-item label { color: #000; font-weight: bold; line-height: 22px; padding: 4px; font-size: 11px; }
#content #main .inner .form-item input { color: #666; font-size: 11px; padding: 4px; }
#content #main .inner .form-item select { color: #666; font-size: 11px; padding: 4px; }
#content #main .inner .form-item textarea { color: #666; font-size: 11px; padding: 4px; }

#content #main #use-brightbook-for-free { position: absolute; left: 20px; bottom: 20px; }

.button a { float: left; display: block; width: 138px; line-height: 30px; padding: 0px; background: transparent url("/images/newempty.gif") no-repeat; text-align: center; font-size: 11px; color: #666; text-decoration: none; font-weight: bold; }
.button a:hover { background: transparent url("/images/newclient.gif") no-repeat; color: #000; }

#content #right { float: left; width: 200px; }
#content #right .item { position: relative; margin: 0px 0px 20px 0px; }
#content #right .item .heading { background: url("/images/heading-bg.gif") repeat-x #fff200; }
#content #right .item .heading .l { background: url("/images/heading-tl.gif") top left no-repeat; }
#content #right .item .heading .r { background: url("/images/heading-tr.gif") top right no-repeat; }
#content #right .item .heading .c { padding: 15px; font-size: 14px; }
#content #right .item .heading .c h1 { font-size: 13px; padding: 0px; margin: 0px; font-weight: bold; font-family: Georgia, Times, "Times New Roman", serif; color: #000; }
#content #right .item .heading .c h1 a { color: #ec018a; text-decoration: none; }
#content #right .item .body { background: url("/images/small-background.png") repeat-x top #ec018a; }
#content #right .item .body .bl { background: url("/images/white-bl.png") no-repeat bottom left; }
#content #right .item .body .br { background: url("/images/white-br.png") no-repeat bottom right; }
#content #right .item .body .inner { padding: 15px 15px 0px 15px; }
#content #right h1 { font-size: 14px; }

#content #right #smartphone-free { position: absolute; right: -15px; bottom: -15px; }

#content #right #smartphones { height: 240px; overflow: hidden; }
#content #right #smartphones div { height: 240px; margin-top: -1px; }
#content #right #smartphones div.first { margin-top: 0px; }

#content #right #compatible { height: 48px; overflow: hidden; }
#content #right #compatible div { padding: 10px 0px; height: 28px; margin-top: 0px; }
#content #right #compatible div.first { margin-top: 0px; }

#content { background: #fff; color: #000; }
#content table { margin: 0px 10px 0px 0px; }
#content table p { margin: 0px; }
#content table h2 { margin: 6px 0px 6px 0px; }

#footercontainer { margin: 0px auto; width: 960px; text-align: left; z-index: 11; }

#footer { position: relative; margin: 10px 5px 50px 0px; color: #fff; font-size: 10px; line-height: 16px; z-index: 11; height: 50px; }
#footer a { color: #fff; text-decoration: none; }
#footer a strong { color: #f8a0d2; }
#footer .links { float: right; }
#footer #facebook { position: absolute; right: 75px; bottom: 0px; }
#footer #twitter { position: absolute; right: 0px; bottom: 0px; }

#footerline { display: none; left: 0px; width: 100%; line-height: 10px; background: #fff200; font-size: 5px; border-top: 2px solid #ec018a; }

.edit a { display: block; width: 55px; margin: 0px; height: 17px; padding: 3px 0px 0px 0px; background: url("/images/edit.gif") no-repeat; text-align: center; font-size: 11px; color: #000; text-decoration: none; line-height: 14px; }
.edit a:hover { background: url("/images/edity.gif") no-repeat; color: #000; }

.table { font-size: 11px; margin: 10px 0px 0px 0px; }
.table th { padding: 2px; vertical-align: top; line-height: 20px; }
.table td { padding: 2px; vertical-align: top; line-height: 20px; }
.table a { text-decoration: none; color: #000; }

#nextprev { margin: 20px 0px 0px 0px; font-size: 13px; text-align: center; border-top: 1px solid #999; padding-top: 10px; }
#nextprev .disabled { color: #999; font-size: 15px; }
#nextprev .selected {}
#nextprev .selected a { font-weight: bold; text-decoration: none; color: #333; }
