/* remove default browser styling */
html,body,div,span,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,li,ol,ul,fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td {border: 0; font-family: inherit; font-style: inherit; font-weight: inherit; margin: 0; padding: 0; text-align: left; vertical-align: baseline}
blockquote:before, blockquote:after,
q:before, q:after {content: ""}
blockquote, q {quotes: "" ""}

/* links */
a img, :link img, :visited img {border: none}
a:link, a:visited {color: #2454F2; text-decoration: underline}
a:hover, a:active {color: #2454F2; text-decoration: underline}

/* text (23px line height) */
strong {font-weight: bold}
em, dt {font-style: italic}

body {color: #3B4D48; font-family: "Helvetica", sans-serif; font-size: 14px; line-height: 1.6429em}
h1, h2, h3, h4, #masthead, #header, #quotes q {font-family: "Century Gothic"}
h1 {font-size: 1.5714em; font-weight: normal;line-height: 1.0455em; margin-bottom: 1.0455em}
h2 {font-size: 1.4286em; font-weight: normal; line-height: 1.1500em; margin-bottom: 1.1500em}
h3, #quotes q {font-size: 1.2857em; font-weight: normal; line-height: 1.2778em; margin-bottom: 1.2778em}
h4 {font-size: 1.1429em; font-weight: normal; line-height: 1.4375em; margin-bottom: 1.4375em}
p, ul, ol, dd, blockquote, pre, td, th, label {font-size: 1em; line-height: 1.6429em; margin-bottom: 1.6429em}
.small, #content div.post blockquote p, #game div.evidence li {font-size: 0.8571em; line-height: 1.9167em; margin-bottom: 1.9167em}
acronym {border-bottom: 1px dotted #3B4D48; cursor: help}

/* tables */
table {border-collapse: collapse; margin-bottom: 1.6429em}

/* layout */
html, body {height: 100%}
#main {min-height: 100%; position: relative}
#masthead, #header, #content, #footer div {margin: 0 auto; padding: 0 10px; width: 886px}
#content {padding-bottom: 208px; position: relative}
#footer {height: 184px; margin-top: -185px; position: relative}
div.clearfix {clear: both; height: 0}

/* masthead */
#masthead {height: 45px; padding-top: 23px}
#masthead h1 {float: left; width: 326px}
#masthead h1 a {background: url(../../images/menu-logo.png) no-repeat; display: block; height: 45px; text-indent: -5000px}

#menu {float: left; list-style: none}
#menu li {border-left: 1px solid #9ea5a3; float: left; width: 222px}
#menu li.game {width: 326px}
#menu li a {color: #3B4D48; display: block; font-size: 1.1429em; height: 46px; line-height: 1.4375em; margin: 0 10px; text-decoration: none}
#menu li.discipline a {background: url(../../images/menu-discipline.png) no-repeat; padding-left: 58px}
#menu li.game a {background: url(../../images/menu-game.png) no-repeat; padding-left: 81px}
#menu li span {color: #9ea5a3; display: block}

/* page header */
#header {border-bottom: 1px solid #9ea5a3; border-top: 1px solid #9ea5a3; height: 68px; margin: 69px auto 23px auto}
#header h1, #header p, #header a {line-height: 68px; margin-bottom: 0}
#header h1 {position: absolute}
#header p {color: #9ea5a3; float: right}
#header ul {float: right; list-style: none}
#header li {float: left; margin-left: 50px}
#header li.selected {background: url(../../images/discipline/selected-h.png) no-repeat bottom center; font-weight: bold}

#header a {display: block; height: 69px; padding-left: 21px}

#header a.rss {background: url(../../images/blog/rss.png) no-repeat 0 51%}

#header a.tour {background: url(../../images/discipline/tour.png) no-repeat 0 51%}
#header a.features {background: url(../../images/discipline/features.png) no-repeat 0 51%}
#header a.support {background: url(../../images/discipline/support.png) no-repeat 0 51%}
#header a.register {background: url(../../images/discipline/register.png) no-repeat 0 51%; color: #F15A24}
#header a.login {background: url(../../images/discipline/login.png) no-repeat 0 51%}

/* event success */
#success {background: #e9e9e7 url(../../images/discipline/success.png) no-repeat 10px 51%; margin-bottom: 23px; padding: 0 36px}

/* home page */
#discipline-promotion {background: url(../../images/home/discipline-promo.png) no-repeat 0 0; height: 253px; margin: 92px 112px; padding: 23px 0 0 346px; width: 316px}
#discipline-promotion h2 {color: #9ea5a3}
#discipline-promotion a {background: url(../../images/home/info.png) no-repeat center left; padding-left: 21px}

#quotes {height: 92px; margin-bottom: 46px; padding: 0 112px; position: relative}
#quotes div {position: absolute; width: 662px}
#quotes div.inactive {display: none}
#quotes q {display: block; text-indent: -.5em}
#quotes cite {color: #9ea5a3; display: block; text-align: right}

/* guided tour */
#tour {list-style: none}
#tour li {float: left; margin: 46px 0}
#tour li.administrator-account-tour {margin-left: 10px}
#tour-video {margin: auto 112px}
#tour-video blockquote {margin-right: 224px}

/* features */
#features {margin: 46px 0 23px 0; padding-top: 23px}
#features ul.navigation {border-right: 1px solid #9ea5a3; height: 414px; list-style: none; margin-top: -11px; position: absolute; width: 194px}
#features ul.navigation a {display: block; line-height: 46px; outline: none; padding-left: 30px; width: 165px}
#features ul.navigation a.selected {background: url(../../images/discipline/selected-v.png) no-repeat center right; font-weight: bold}

#features li.reports {background: url(../../images/discipline/features/reports.png) no-repeat center left}
#features li.electronic-referrals {background: url(../../images/discipline/features/electronic-referrals.png) no-repeat center left}
#features li.referral-history {background: url(../../images/discipline/features/referral-history.png) no-repeat center left}
#features li.calendar {background: url(../../images/discipline/features/calendar.png) no-repeat center left}
#features li.smart-import {background: url(../../images/discipline/features/smart-import.png) no-repeat center left}
#features li.security {background: url(../../images/discipline/features/security.png) no-repeat center left}
#features li.value {background: url(../../images/discipline/features/value.png) no-repeat center left}

#features div.scroll {margin-left: 204px; overflow: hidden; width: 682px; position: relative}
#features div.panel {width: 774px; min-height: 299px; padding-left: 20px}

#reports.panel {background: url(../../images/discipline/features/reports-bg.png) no-repeat 406px 0}
#electronic-referrals.panel {background: url(../../images/discipline/features/electronic-referrals-bg.png) no-repeat 406px 0}
#referral-history.panel {background: url(../../images/discipline/features/referral-history-bg.png) no-repeat 406px 0}
#calendar.panel {background: url(../../images/discipline/features/calendar-bg.png) no-repeat 406px 0}
#smart-import.panel {background: url(../../images/discipline/features/smart-import-bg.png) no-repeat 406px 0}
#security.panel {background: url(../../images/discipline/features/security-bg.png) no-repeat 460px 0}
#value.panel {background: url(../../images/discipline/features/value-bg.png) no-repeat 337px 0}

#features div.panel p {margin-right: 336px}

#features div.figure {float: left; margin: 0 10px 23px 0; width: 102px}
#features div.figure a {color: #9ea5a3; display: block; text-align: center}
#features div.figure span.rendered {background: #fff; border: 1px solid #9ea5a3; display: block; height: 68px; overflow: hidden; width: 102px}
#features div.figure img {display: block; margin: auto}

#features h3 {color: #9ea5a3}

/* support */
#toc {float: left}
#toc div {width: 214px}
#toc p {display: none}
#toc ul {list-style: none}
#toc span {color: #9ea5a3}
#toc.index div {float: left; margin-left: 10px}
#toc.index div.howto {margin-left: 0}
#toc.index p {color: #9ea5a3; display: block; margin-right: 15px}
#toc li.selected a {font-weight: bold}

#theater {margin-left: 224px}
#video {border: 1px solid #9ea5a3; height: 414px; margin-bottom: 1.6429em; overflow: hidden; width: 660px}
#video embed {margin-left: -1px}
a.video {background: url(../../images/discipline/tour.png) no-repeat 0 51%; padding-left: 21px}

#chapter {margin: 0 244px 0 224px}
#chapter.document-template-codes {margin-right: 112px}
#chapter td.code {font-family: monospace; padding-right: 10px}

#figures {position: absolute; right: 11px; top: 0; width: 214px}
#figures h2 {visibility: hidden}
#figures div {margin-bottom: 6.5714em}
#figures a {color: #9ea5a3; display: block}
#figures span.rendered {background: #fff; border: 1px solid #9ea5a3; display: block; height: 136px; overflow: hidden; width: 212px}
#figures img {display: block; margin: auto}

#answers {margin: 0 112px 0 224px}

/* registration */
div.register {float: left; width: 326px}
form.register {margin-left: 336px}
form.register h2 {margin-left: 112px}
.register fieldset span {color: #9ea5a3}
.register ul {list-style: none}
.register ul li {clear: left}
.register ul li label {color: #9ea5a3; float: left; margin-right: 10px; text-align: right; width: 102px}
.register ul li input {width: 316px}

.register fieldset p {margin-left: 112px; width: 356px}
p.addons, #terms {position: relative}
#classroomactions, #translate, #agree {left: -2em; position: absolute; bottom: 25px; vertical-align: bottom}
#classroomactions, #translate {bottom: 2px}

/* game */
#game div {float: left; width: 428px}
#game div img {display: block; margin: 0 auto 23px auto}

#game div.introduction {width: 886px}
#game div.introduction img.logo {margin: -23px 0 23px -10px}
#game div.introduction div {color: #666; float: right; width: 326px}
#game div.introduction h3 {margin: 23px 0}

#game div.introduction ul {list-style: none}
#game div.introduction li {display: block; float: left; text-align: center}
#game div.introduction li a {background: #efa345; color: #fff; display: block; font-weight: bold; height: 34px; line-height: 34px; text-align: center; text-decoration: none; width: 158px; -moz-border-radius: 5px; -webkit-border-radius: 5px}

#game div.introduction li.video {float: none; margin-bottom: 29px; width: auto}
#game div.introduction li.video a {background: none; border: 3px solid #e9e9e7; display: block; height: 98px; margin: 0 auto; width: 156px; -moz-border-radius: 0; -webkit-border-radius: 0}

#game div.introduction li.signup a {background: #313d6f}
#game div.introduction li.login {margin-left: 10px}

#game div.how-to-play {background: #e9e9e7; border-bottom: 1px solid #9ea5a3; border-top: 1px solid #9ea5a3; clear: left; margin-bottom: 23px; width: 886px}
#game div.how-to-play h2 {display: none}
#game div.how-to-play ol {list-style: none; margin-left: -10px; width: 896px}
#game div.how-to-play li {display: block; float: left; margin: 12px 0 12px 10px; text-align: center; width: 214px}
#game div.how-to-play img {display: block; margin: 9px auto 12px auto}

#game div.innovative-game-play, #game div.multiple-roster-support {clear: left; margin-right: 20px}
#game div.leaderboard {float: right; margin-right: 10px}

#game table {margin-bottom: 26px; width: 428px}
#game th, #game td {border: 1px solid #ccc; padding: 6px 5px; text-align: center; vertical-align: middle}
#game th {background: #ededed; font-weight: bold}
#game th.item {text-align: left; width: 92px}
#game td {background: #f9f9f9; line-height: 1.4}
#game div table tr.browser td a {text-decoration: none}
#game div table td img {display: inline; margin-bottom: 0}

#game div.evidence {border-top: 1px dashed #9ea5a3; clear: left; padding-top: 23px; width: 886px}
#game div.evidence ul {list-style: none; margin-left: -20px; width: 906px}
#game div.evidence li {float: left; margin-left: 20px; width: 204px;}

/* game overview video */
#game-overview {margin: 46px 112px 23px 112px}
#game-overview blockquote {margin-right: 224px}

/* weblog */
#content div.post {margin: 0 356px 0 112px; position: relative}
#content div.post span.date {color: #9ea5a3; margin-left: -112px; position: absolute}
#content div.post p img {display: block}
#content div.post blockquote {border-left: 1px solid #9ea5a3; padding: 0 1em}

#links {float: right; width: 326px}
#links ul {list-style: none}
#links p.about {margin-right: 15px}
#links ul.recent {color: #9ea5a3}

/* about us */
#contact {float: right; width: 326px}
#contact div.org {font-weight: bold}
#contact div.vcard {margin-bottom: 1.6429em}
#contact a.vcf {background: url(../../images/about/vcard.png) no-repeat center left; padding-left: 21px}
#about {width: 535px}

/* legal */
#documents {float: left; list-style: none; margin-left: 112px; width: 214px}
#documents li.selected a {font-weight: bold}
div.document {margin-left: 336px; width: 438px}

/* footer */
#footer {background: #e9e9e7; color: #595757; border-top: 1px solid #9ea5a3}
#footer ul {list-style: none}
#footer li {float: left; margin-right: 10px; width: 214px}
#footer li.about {margin-left: 112px; width: 311px}
#footer p.copyright {background: url(../../images/footer-logo.png) no-repeat center left; clear: left; padding-left: 37px}

/* fancybox */
div#fancy_overlay {background-color: #fff; display: none; height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 30}
div#fancy_loading {background: transparent; cursor: pointer; display: none; height: 40px; overflow: hidden; position: absolute; width: 40px; z-index: 100}
div#fancy_loading div {background: transparent url(../../images/fancy_progress.png) no-repeat; height: 480px; left: 0; position: absolute; top: 0; width: 40px}
div#fancy_close {background: transparent url(../../images/fancy_closebox.png); cursor: pointer; display: none; height: 30px; position: absolute; top: -12px; left: -12px; width: 30px; z-index: 100}
div#fancy_content {cursor: pointer; height: 100%; left: 0; margin: 0; padding: 0; position: absolute; top: 0; width: 100%; z-index: 96}
#fancy_frame {display: none; height: 100%; position: relative; width: 100%}
img#fancy_img {border:0; height: 100%; left: 0; margin: 0; padding: 0; position: absolute; top: 0; width: 100%; z-index: 92}
div#fancy_outer {background: transparent; display: none; left: 0; margin: 0; overflow: hidden; padding: 18px 18px 58px 18px; position: absolute; top: 0; z-index: 90}
div#fancy_inner {background: #FFF; border: 1px solid #9ea5a3; height:100%; position: relative; width:100%}
div#fancy_bg {display: none}

/* development
body {background: url(../../images/grid.png) no-repeat 50% -11px}
/**/