/* HTML elements */

a { color: #267698; text-decoration: none }
a img { border: none }
body { background: #D4BF7B url('http://cdn0.xtramath.org/images/woodgrain.jpg'); color: #404040; font: 10pt Tahoma; height: 100%; margin: 0 }
h1 { font: 24pt Georgia; margin: 0 0 12px 0 }
h2 { font: 20pt Georgia; margin: 0 0 8px 0 }
html { height: 100% }
p { margin-top: 0px }
table { border-collapse: collapse }
table.w { width: 100% }
td { padding: 0 }
th { text-align: left }

/* forms */

form { margin: 0px }
input.checkbox { margin-left: 0px }
input.text { background: #F8F8F8; border: 1px solid #BCBCBC; display: block; font-size: 12pt; width: 217px; height: 24px; padding: 2px 1px 0px 2px }
textarea {  background: #F8F8F8; border: 1px solid #BCBCBC; display: block; font-size: 12pt }
select {  background: #F8F8F8; border: 1px solid #BCBCBC; display: block; font-size: 12pt }
label { display: block; font-size: 9pt; margin-bottom: 1px }
label.checkbox { display: inline }
.fieldWithErrors { display: inline }
.formError { color: #B35A33; font-size: 8pt }

/* form tables */

td.label { text-align: right; vertical-align: middle; width: 210px; padding-right: 10px }
td.label.top { vertical-align: top; padding-top: 10px }
td.field { width: 240px }
td.note { vertical-align: middle }

/* page structure */

#header_background { background: #8DA5A4 url('http://cdn1.xtramath.org/images/header-background.png') repeat-x; position:absolute; left: 0px; right: 0px; min-width: 931px; height: 92px }
#column { width: 931px; min-height: 100%; margin: 0 auto; position: relative }
#header { position: relative; height: 82px }
#main { padding-bottom: 63px /* height of #footer */; position: relative }
#footer { color: #86764f; font-size: 8pt; position: absolute; bottom: 0; height: 63px; padding-left: 57px }

/* header items */

#logo { position: absolute; left: 75px; top: 9px }
#user { color: white; font-size: 14pt; position: absolute; top: 26px; right: 4px }
#logout { position: absolute; top: 51px; right: 4px }
#logout a { color: white; text-decoration: none }

#site_description { text-align: center; padding: 36px 0px }

/* menu items */

#home_menu { position: absolute; left: 382px; top: 25px }
#learnmore_menu { position: absolute; left: 481px; top: 25px }
#aboutus_menu { position: absolute; left: 636px; top: 25px }
#signup_menu { position: absolute; left: 767px; top: 25px }

/* tabs */

#tabs { margin: 0 0 -7px 19px; position: relative; height: 38px; z-index: 1 }
#tabs a { color: #404040 }
td.tabs { padding: 0 2px }
span.tab_label { position: relative; top: -5px }

table.tab { /* cursor: pointer; */ position: relative }
table.tabf { /* cursor: pointer; */ position: relative }
table.tabs { /* cursor: pointer; */ position: relative }
td.tab_c { height: 38px; padding: 0px 25px }
td.tabf_c { height: 38px; padding: 0px 25px }
td.tabs_c { height: 38px; padding: 0px 30px }

/* <%= three_slice_style :class=>'tab', :extension=>'.png', :background=>:image, :margin=>4 %> */
td.tab_l { background: url('http://cdn1.xtramath.org/images/tab-l.png'); width: 4px }
td.tab_c { background: url('http://cdn2.xtramath.org/images/tab-c.png') }
td.tab_r { background: url('http://cdn3.xtramath.org/images/tab-r.png'); width: 4px }

/* <%= three_slice_style :class=>'tabf', :extension=>'.png', :background=>:image, :margin=>4 %> */
td.tabf_l { background: url('http://cdn4.xtramath.org/images/tabf-l.png'); width: 4px } 
td.tabf_c { background: url('http://cdn5.xtramath.org/images/tabf-c.png') }
td.tabf_r { background: url('http://cdn6.xtramath.org/images/tabf-r.png'); width: 4px }

/* <%= three_slice_style :class=>'tabs', :extension=>'.png', :background=>:image, :margin=>4 %> */
td.tabs_l { background: url('http://cdn7.xtramath.org/images/tabs-l.png'); width: 4px }
td.tabs_c { background: url('http://cdn8.xtramath.org/images/tabs-c.png') }
td.tabs_r { background: url('http://cdn9.xtramath.org/images/tabs-r.png'); width: 4px }

/* popup index card */

.card { position: absolute; width: 604px }
.card .t { background: url('http://cdn3.xtramath.org/images/card-t.png') no-repeat;  height: 66px }
.card .m { background: url('http://cdn4.xtramath.org/images/card-m.png') repeat-y;  }
.card .b { background: url('http://cdn5.xtramath.org/images/card-b.png') no-repeat; height: 8px }

.card h1 { font: 24pt Georgia; position: absolute; left: 32px; top: 34px }
.close_icon { position: absolute; top: 10px; right: 10px; z-index: 1; cursor: pointer }

/* pages */

.page { position: relative }
.page .t { background: url('http://cdn1.xtramath.org/images/page-t.png') no-repeat;  height: 86px }
.page .m { background: url('http://cdn2.xtramath.org/images/page-m.png') repeat-y;  }
.page .b { background: url('http://cdn3.xtramath.org/images/page-b.png') no-repeat; height: 7px }

/* popups */

div.popup { /* required: */ position: absolute; }
#popup_overlay { background-color: whitesmoke; /* required: */ position: absolute; top: 0; left: 0; width: 100%; height: 500px;  }
span.popup_link, a.popup_link { color: #267698; cursor: pointer  }
.popup_draghandle { cursor: move; }

.close_icon { position: absolute; top: 10px; right: 10px; z-index: 1; cursor: pointer }

#reset_password_popup { }
#reset_password { height: 243px }
#reset_password .f1 { position: absolute; left: 33px; top: 106px } 
#reset_password .f2 { position: absolute; left: 33px; top: 166px } 
#reset_password .f3 { position: absolute; left: 167px; top: 262px }
#reset_password .f4 { position: absolute; left: 266px; top: 262px }

/* post it note popups */

.postit { background:url('http://cdn2.xtramath.org/images/postit.png'); color: black; position: absolute; width: 214px; height: 217px; padding: 20px 20px 20px 20px }
.postit h1 { font: 18pt Tahoma }

/* home page */

.login_card { width: 266px; height: 374px }
.login_card .formError { margin-top: 2px; width: 220px; height: 14px; text-align: right }
.login_card .field { margin-bottom: 1px }
.login_card .forgot { margin: -5px 0 10px 0 }

.signin { position: absolute; left: 79px; top: 315px }

#student_card {cursor: pointer; position: absolute; left: 51px; top: 126px }
#teacher_card { cursor: pointer; position: absolute; left: 335px; top: 126px }
#classroom_card { cursor: pointer; position: absolute; left: 619px; top: 126px }

#student_login { background: url('http://cdn3.xtramath.org/images/student-login-background.gif') no-repeat; position: absolute; left: 51px; top: 106px }
#student_login_form { padding: 69px 22px 0px 22px } 

#student2_login { background: url('http://cdn4.xtramath.org/images/student2-login-background.gif') no-repeat; position: absolute; left: 51px; top: 106px }
#student2_login_form { padding: 102px 22px 0 22px } 
#student2_login_form td { border-bottom: 1px solid #9AD7D0; height: 31px }
#student2_login_form td.name { padding-left: 12px }
#student2_login_form td.name button { border: none; background: transparent; color: #267597; cursor: pointer; font: 12pt Georgia; padding: 0 }
#student2_login_form td.name input { border: none; background: transparent; color: #267597; cursor: pointer; font: 12pt Georgia; padding: 0 }
#student2_login_form td.delete { padding-right: 6px; width: 28px }
#student2_login_form td.delete input { position: relative; top: 2px }

#teacher_login { background: url('http://cdn5.xtramath.org/images/teacher-login-background.gif') no-repeat; position: absolute; left: 335px; top: 106px }
#teacher_login_form { padding: 100px 22px 0 22px } 

#classroom_login { background: url('http://cdn6.xtramath.org/images/classroom-login-background.gif') no-repeat; position: absolute; left: 619px; top: 106px }
#classroom_login_form { padding: 69px 22px 0 22px } 

/* teacher's guide */

#guide { padding: 0px 90px 90px 223px }

/* about us pages */

#people { position: absolute; left: 42px; top: 157px; z-index: 1 }
#sponsors { position: absolute; left: 150px; top: 157px; z-index: 1 }
#donate { position: absolute; left: 262px; top: 157px; z-index: 1 }

#aboutus_page { font: 12pt/150% Georgia; padding: 0px 90px 90px 223px }

.lmargin { float: left; margin-left: -174px }
.caption { font: 10pt Tahoma; margin: 0px }
#last { margin-top: 32px }
.logo { padding-right: 20px }

/* parent signup & teacher signup */

#signup_page { padding: 0px 90px 90px 0px }

#terms { background: rgb(248,248,248); border: 1px solid rgb(138,138,138); font-size: 8pt; height: 140px; overflow: auto; padding: 4px; width:212px }
#terms p { margin: 0 0 2px 0 }
#terms ul { list-style: disc inside; margin: 0 0 5px 0; padding-left: 0px } 

/* teacher request */

.r1 td { padding-bottom: 40px }
.r2 td { padding-bottom: 5px }
.r3 td { padding-bottom: 40px }
.r4 td { padding-bottom: 20px }