/* ******************************************************************************** The Southern Baptist Academy ******************************************************************************** The contents of this style sheet are copyright 1999-2007 The Southern Baptist Academy and may not be reproduced without the expressed written consent of the copyright holder. ******************************************************************************** FORMAT The order of this style sheet corresponds to the intended visual appearance of page elements, prioritized first by left-to-right, and then by top-to-bottom. Elements will be selected up to three times (as necessary) and will be selected according to the following order: 1. Dimensional aspects - element width, height, margin, padding etc. 2. Stylistic aspects - backgrounds, colors, typography, etc. 3. Positional aspects - position, left, right, top, bottom, etc. ********************************************************************************* */ /** General Selectors **/ html {} body {margin: 0; padding: 0; text-align: center; /*text-align listed in dimension because it fixes an IE margin bug*/} body {font-family: Arial, Verdna, sans-serif; background: #ffffff url( /images/bg_1.gif ); font-size: 13px;} /** Quotes **/ cite {display: block;} cite:before {content: '- ';} a {text-decoration: none;} a:active, a:focus {outline: none; border: none;} p, h1, h2, h3, h4, h5, h6, ul, ol, dl, dt, dl, li {margin: 0; padding: 0;} fieldset {padding: 0; margin: 0;} fieldset {border: none;} form {padding: 0; margin: 0;} ul, ol {list-style-type: none;} /** Container **/ div#container {width: 750px; margin: 0 auto 40px auto;} div#container {text-align: left; border-top: 3px solid #993333; background: #ffffff;} /** Header **/ div#header {} #header h1 a {display: block; width: 750px; height: 178px;} #header h1 a {text-indent: -9999px; background: #ffffff url( /images/headerBack.gif ) no-repeat bottom left;} /** Social **/ div#social {width: 750px; margin: 0 auto 4px auto;} /** Top Nav * * Link width: 125px; **/ div#topNav {} #topNav ul {padding-top: 5px;} #topNav ul li {float: left; position: relative;} #topNav ul li a {display: block; width: 124px; padding: 4px 0;} #topNav ul li a {text-align: center; color: #ffffff; background-color: #cc6666; border-right: 1px solid #993333; border-top: 1px solid #993333; border-bottom: 1px solid #993333;} #topNav ul li a:hover {background-color: #993333;} #topNav ul li a.first {width: 123px;} #topNav ul li a.first {border-left: 1px solid #993333;} #topNav ul li ul {display: none;} #topNav ul li ul {} #topNav ul li ul {position: absolute; top: 21px; left: 0;} #topNav ul li ul li {float: none;} #topNav ul li ul li a {display: block; width: 232px; padding: 4px;} #topNav ul li ul li a {background-color: #920a02; text-align: left;} #topNav ul li ul li a:hover {background-color: #cc6666;} /** Content **/ div#content {padding-top: 5px; padding-bottom: 30px;} div#content {color: #666666;} div#content {clear: left;} #content a {color: #993333; text-decoration: underline;} #content a:hover {color: #000000;} #content address {padding-bottom: 10px; padding-left: 21px;} #content address {font-size: 11px; font-style: normal;} #content address span {display: block;} #content h2, #content h3, #content p {padding: 0 21px;} #content h2 {margin-top: 0px; margin-bottom: 8px;} #content h2 {font-size: 15px;} #content h3 {font-size: 13px; margin-bottom: 11px;} #content p {font-size: 11px; margin-bottom: 11px; clear: none;} #content p.quote {padding-left: 50px;} #content p q {} #content img {} #content img#livePerson {float: right; margin: 37px 21px 10px 20px;} #content table {margin: 0 21px 10px 21px;} #content table {border-collapse: separate; border: 1px solid #bbbbbb; font-size: 11px; color: #666666;} #content table {} #content table thead {} #content table thead tr {} #content table thead tr td {font-weight: bold; background-color: #cccccc;} #content table tbody {} #content table tbody tr {} #content table tbody tr td, #content table thead tr td {border: 1px solid #666666; border-right-color: #bbbbbb; border-bottom-color: #bbbbbb;} #content ul {padding-left: 60px; padding-bottom: 15px;} #content ul {list-style: disc; font-size: 11px;} #content div.kayakoLink {padding: 20px 21px 0 15px;} #content div.kayakoLink {list-style: none;} #content div.kayakoLink {float: right; clear: right;} #content ul.pictureStripRight {padding: 20px 21px 0 15px;} #content ul.pictureStripRight {list-style: none;} #content ul.pictureStripRight {float: right; clear: right;} #content ul.pictureStripRight img {margin-bottom: 10px;} #content ul.pictureStripLeft {padding: 10px 10px 10px 21px;} #content ul.pictureStripLeft {list-style: none;} #content ul.pictureStripLeft {float: left;} .bordered {border: 3px solid #993333;} #content ul.privacyAndTerms {padding-left: 21px; padding-right: 21px;} #content ul.privacyAndTerms {list-style: none;} #content ul.privacyAndTerms li {padding-bottom: 10px;} #content ul.privacyAndTerms li h3 {padding-left: 0;} #content ul.privacyAndTerms li ul {padding-top: 10px;} #content ul.privacyAndTerms li dl {padding-top: 10px;} #content ul.privacyAndTerms li dl dt {padding-left: 21px;} #content ul.privacyAndTerms li dl dt {font-weight: bold;} #content ul.privacyAndTerms li dl dd {padding-top: 10px; padding-left: 21px; padding-bottom: 10px; margin-left: 0;} #content p.inset {padding-left: 54px;} #content p.inset q {font-style: italic;} #content p.inset cite {font-style: normal; font-weight: bold;} /** Homepage-specific **/ div#leftColumn, div#middleColumn, div#rightColumn {float: left;} /** Left column * * Total width: 220px; **/ #leftColumn a#_lpChatBtn{margin-left:15px;} #leftColumn {width: 218px; padding-right: 2px;} #leftColumn div#phone {text-align: center; font-size: 22px; font-family: arial; color: #b84747; padding-bottom: 5px;} #leftColumn p#dobsonQuote {display: block; width: 120px; height: 120px; padding-left: 21px; padding-right: 0;} #leftColumn p#dobsonQuote {text-indent: -9999px; background: url( /images/under-left.jpg ) no-repeat 21px 0;} #leftColumn p#dobsonQuote {float: left;} #leftColumn h3 {font-size: 13px; line-height: 13px; padding-left: 21px; padding-right: 0;} #leftColumn p {padding: 0;} #leftColumn p {font-size: 11px; color: #666666; line-height: 11px;} #leftColumn p {float: none;} #leftColumn form {padding-top: 15px; padding-left: 21px;} #leftColumn form {background: url( /images/horizontalDottedBack.gif ) repeat-x 0 4px;} #leftColumn form {clear: left;} #leftColumn form fieldset {padding: 0 0 10px 0;} #leftColumn form fieldset {} #leftColumn form fieldset legend {font-size: 11px; font-weight: bold; color: #666666;} #leftColumn form fieldset ol {} #leftColumn form fieldset ol li {float: left;} #leftColumn form fieldset ol li input {width: 140px;} #leftColumn form fieldset ol li input {} #leftColumn form fieldset ol li input#submit {padding: 2px 0 0 0; width: auto;} #leftColumn form fieldset ol li input#submit {border: none; background: #ffffff; font-size: 11px; color: #a9585f; border-bottom: 1px solid #a9585f;} #leftColumn form fieldset ol li input#submit {} #leftColumn form filedset ol li label {} #leftColumn form p {padding-bottom: 10px; margin-bottom: 10px; padding-left: 0; padding-right: 0;} #leftColumn form p {font-size: 10px; text-indent: 0; background: url( /images/horizontalDottedBack.gif ) repeat-x bottom left;} #leftColumn div#dottedline {height:3px; background:transparent url(/images/horizontalDottedBack.gif) repeat-x scroll left top;} /** Log-in Forms **/ a#student {display: block; width: 98px; height: 112px; padding-left: 21px;} a#student {text-indent: -9999px; background: url( /images/studentLogin.jpg ) no-repeat 21px 0;} a#student {float: left;} a#parent {display: block; width: 99px; height: 112px;} a#parent {text-indent: -9999px; background: url( /images/parentLogin.jpg ) no-repeat;} a#parent {float: right; clear: none;} #leftColumn form#studentLogin {display: none;} #leftColumn form#parentLogin {display: none;} #leftColumn form#parentLogin input.submit, #leftColumn form#studentLogin input.submit {width: auto;} #leftColumn p#mimiQuote {padding-top: 30px; padding-bottom: 10px; padding-left: 21px; padding-right: 0;} #leftColumn p#mimiQuote {font-style: italic; background: url( /images/horizontalDottedBack.gif ) repeat-x bottom left;} #leftColumn p#mimiQuote {clear: both;} #leftColumn p#mimiQuote cite {padding-top: 10px;} #leftColumn p#mimiQuote cite {font-style: normal;} #rightColumn h3#search {padding-bottom: 5px; padding-top: 10px; padding-left: 21px; padding-right: 0;} #rightColumn h3#search {font-size: 14px; color: #993333; } #rightColumn form.search {background: none; text-align:center;} /* #leftColumn img {margin: 30px auto 40px 35px;} #leftColumn img#star {margin:0 auto 20px 47px;} */ /** Middle column * * Total width: 220px; **/ #middleColumn {width: 220px;} #middleColumn {background: url( /images/contentBack.gif ) repeat-y; text-align: center;} #middleColumn p {padding: 0;} #middleColumn h3#notAlong {padding: 0;} #middleColumn h3#notAlone {font-size: 13px; font-weight: bold; text-align: center;} #middleColumn ul {text-align: left; padding: 0 6px 10px 6px;} #middleColumn ul {background: url( /images/horizontalDottedBack.gif ) repeat-x bottom left; list-style: none;} #middleColumn ul li {padding-left: 6px; margin-top: 10px;} #middleColumn ul li {background: url( /images/pic9.gif ) no-repeat center left; font-size: 11px; font-weight: bold; color: #666666;} #middleColumn .youGet {text-indent: -9999px;} #middleColumn .youGet {line-height: 0;} #middleColumn h3.youGet {padding: 0;} #middleColumn ul.youGet {display: block; width: 208px; height: 205px; margin-top: 10px;} #middleColumn ul.youGet {background: url( /images/middle_you_get.jpg ) no-repeat top center;} #middleColumn ul.youGet li {background: none;} #middleColumn a#homeschoolingResources {display: block; width: 195px; height: 60px; margin: 0 auto 15px auto;} #middleColumn a#homeschoolingResources {text-indent: -9999px; background: url( /images/resources.gif ) no-repeat;} #middleColumn img#npsaa {margin-bottom: 30px;} /** Right column * * Total width: 310px; **/ #rightColumn {width: 310px;} #rightColumn {text-align: center;} #rightColumn {clear: none;} #rightColumn a {color: #993333; text-decoration: underline;} #rightColumn * {float: none; clear: both;} #rightColumn img {margin: 0 auto;} #rightColumn img {float: none;} #rightColumn p#freeCounseling {padding-top: 2px; padding-left: 0; padding-right: 0;} #rightColumn p#freeCounseling {font-weight: bold; font-size: 13px; background: url( /images/horizontalDottedBack.gif ) repeat-x top left; line-height: 22px; text-align: center; color: #000000;} #rightColumn #freeCounseling span#bigPhoneNumber {display: block;} #rightColumn #freeCounseling span#bigPhoneNumber {font-size: 24px;} #rightColumn h3#exodusPartner {padding: 5px 40px;} #rightColumn h3#exodusPartner {font-size: 13px; background: url( /images/horizontalDottedBack.gif ) repeat-x top left;} #rightColumn p {padding: 0 8px 10px 8px;} #rightColumn p {font-size: 11px; color: #666666; text-align: left; line-height: 12px;} #rightColumn form {padding: 10px 0;} #rightColumn form {text-align: left; } #rightColumn form fieldset {} #rightColumn form fieldset legend {padding-left: 34px;} #rightColumn form fieldset legend {font-weight: bold;} #rightColumn form fieldset ol {padding-left: 35px;} #rightColumn form fieldset ol li {} #rightColumn form fieldset ol li input {} #rightColumn form fieldset ol li label {font-size: 11px; color: #666666;} /** Statement of Faith **/ ol#statementOfFaith {padding-left: 21px; padding-right: 21px;} ol#statementOfFaith {list-style-type: upper-roman; list-style-position: inside;} ol#statementOfFaith li {padding-left: 0; padding-bottom: 10px;} ol#statementOfFaith li {font-size: 11px;} ol#statementOfFaith li h3 {padding: 0; width: auto; display: block;} ol#statementOfFaith li h3 {} ol#statementOfFaith li ol {padding-left: 21px; padding-top: 15px;} ol#statementOfFaith li ol {list-style-type: upper-alpha; list-style-position: inside;} ol#statementOfFaith li ol#salvation {padding-left: 42px;} ol#statementOfFaith li ol#salvation {list-style-position: outside;} ol#statementOfFaith li ol#salvation {float: none;} ol#statementOfFaith li ol li {float: none;} ol#statementOfFaith li ol li h4 {font-size: 11px;} /** Article Link List **/ #content ul.articleLinkList {padding-left: 36px;} #content ul.articleLinkList li {display: block; width: 140px; padding-right: 20px; padding-left: 0;} #content ul.articleLinkList li {float: left;} #content ul.articleLinkList li h4 {display: block; width: 140px; height: 20px; padding: 25px 0 0 0; margin-bottom: 0;} #content ul.articleLinkList li h4 {background: url( /images/resource-header.gif ) no-repeat; text-align: center; font-size: 14px;} #content ul.articleLinkList li ul {padding-top: 10px; padding-left: 0;} #content ul.articleLinkList li ul {font-size: 11px;} #content ul.articleLinkList li ul li {float: none;} #content ul.articleLinkList li ul li a {} /** How it Works **/ ul.insetBold {padding-left: 20px; padding-top: 20px; padding-bottom: 20px;} #content ul.insetBold {font-weight: bold; font-size: 11px; list-style: none;} ul.insetBold {} ul.insetBold li {padding-left: 60px;} /** Daily Lesson Plans **/ img#lesson {margin-left: 60px;} /** DiplomaRequire**/ #content ol {padding-left:60px; margin:0 0 10px 0; } #content ol {list-style-type:decimal; list-style-position:outside; font-size:11px;} #content p#warning {color:#f00; font-weight:bold;} #content ul#diplomaReq {list-style-type:none; padding:0; } #content ol#diplomaReq {padding:0;list-style-type:decimal; list-style-position:inside; margin:0; } #content table td {padding:3px; } /** Our Homeschool Tuition **/ table.tuition td, table.fees td {padding: 3px;} table.tuition td, table.fees td {vertical-align: top;} span.fivePercent {display: block;} span.fivePercent {color: #0099cc;} p.enroll {} p.enroll {text-align: center;} p.enroll a {display: block; width: 236px; height: 22px; margin: 0 auto;} p.enroll a {text-indent: -9999px; background: url( /images/enroll_08.gif ) no-repeat; } /** Exodus Partners **/ form#exodusinfo {padding-left: 21px;} form#exodusinfo {font-size: 11px; font-weight: bold;} form#exodusinfo fieldset {} form#exodusinfo fieldset ol {} form#exodusinfo fieldset ol li {padding-bottom: 10px;} form#exodusinfo fieldset ol li label {display: block;} form#exodusinfo fieldset ol li input, form#exodusinfo fieldset ol li textarea, form#exodusinfo fieldset ol li select { font-size: 11px; font-weight: bold; color: #993333; font-family: Arial;} /** Master FAQ Page **/ h2#faqHeaders a {color:#666; text-decoration:none;} ul#masterFaqList {padding-left: 21px;} ul#masterFaqList {list-style: none;} ul#masterFaqList li {padding-left: 0;} ul#masterFaqList li h3 {padding-left: 0;} ul#masterFaqList li ul {padding-left: 0;} ul#masterFaqList li ul {list-style: none;} ul#masterFaqList li ul li {} ul#masterFaqList li ul li a {} /** Individual FAQ Pages **/ dl.faqList {padding-left: 21px; padding-right: 21px;} dl.faqList {font-size: 11px;} dl.faqList dt {font-weight: bold;} dl.faqList dd {padding-left: 0; margin-left: 0; padding-bottom: 10px;} /** Multimedia **/ div#multimedia {margin:0 auto; width:630px;} #multimedia ul {list-style-type:none;} #multimedia ul {margin-left:5px; padding-right:0; padding-left:0;} #multimedia li {line-height:16px; margin:0 0 18px 0;} #multimedia .leftWrapper, .rightWrapper{width:200px;} #multimedia .leftWrapper, .rightWrapper{display: block; } #multimedia .leftWrapper, .rightWrapper{float:left;} #multimedia .centerWrapper{width:200px;} #multimedia .centerWrapper{display: block;} #multimedia .centerWrapper{float:left; margin: 0 15px 0 15px;} #multimedia .contentBlock {width: 200px;} #multimedia .contentBlock {display: block; } #multimedia .contentBlock {float: left; margin-bottom:20px;} #multimedia .contentBlock ul {padding-right:0px;} #multimedia .list {background-color: #f58583; } #multimedia .list {padding:10px 10px 10px 10px;} #multimedia .list a{color:#000000; font-family: Arial, Helvetica, sans-serif; font-size:12px;} #multimedia .whiteList {background-color: #f58583; } #multimedia .whiteList {padding:10px 10px 10px 10px;} #multimedia .whiteList a {color:#fff; font-family: Arial, Helvetica, sans-serif; font-size:12px;} /** Contact Page **/ ul#contactList {padding-left: 21px;} ul#contactList {list-style: none;} ul#contactList {clear: left;} ul#contactList li {padding-bottom: 10px;} ul#contactList li span {display: block;} ul#contactList li span {font-weight: bold;} span.phone, span.times {display: block; padding-left: 40px; padding-bottom: 5px;} span.phone, span.times {font-size: 11px;} span.phone {background: url( http://www.learningbygrace.org/images/global/icon_phone.gif ) no-repeat 21px 0;} span.times {background: url( http://www.learningbygrace.org/images/global/icon_clock.gif ) no-repeat 21px 0;} /** Mimi's CV **/ #content h3.mimiCV {font-size: 24px; text-align: center;} address.mimiCV {padding-right: 21px;} address.mimiCV {text-align: center;} ul#mimiCV {padding-left: 21px; padding-right: 21px;} ul#mimiCV {list-style: none;} ul#mimiCV li {} ul#mimiCV li h4 {text-align: center;} ul#mimiCV li ul {padding-left: 42px;} ul#mimiCV li ul {list-style: disc;} ul#mimiCV li.parent ul {padding-left: 0;} ul#mimiCV li.parent ul {list-style: none;} ul#mimiCV li.parent ul li {padding-top: 10px;} ul#mimiCV li.parent ul li {border-bottom: 1px solid #666666;} ul#mimiCV li ul li h5 {font-size: 11px;} ul#mimiCV li ul li h5 span {display: block;} ul#mimiCV li ul li h5 span.duration {text-align: right;} ul#mimiCV li ul li ul {padding-left: 42px; padding-top: 10px;} ul#mimiCV li ul li ul {list-style: disc;} ul#mimiCV li.parent ul li ul {padding-left: 42px;} ul#mimiCV li.parent ul li ul {list-style: disc;} ul#mimiCV li.parent ul li ul li {padding-top: 0;} ul#mimiCV li.parent ul li ul li {border-bottom: none;} /** Course Pages **/ #content ul.curriculumGradeLinks, #content ul.courseList, #content ul.courseList li {list-style-type:none;} #content ul.courseList li dl dd {margin-bottom:10px;} #content ul.courseList {padding:0} #content ul.courseList ul {margin-left:0px; padding-left:24px;} #content ul.courseList h3{font-size:14px;} #content ul.courseList h4{font-size:13px;} #content ol.courseList {padding-left: 21px;} #content ol.courseList {list-style: none;} #content ol.courseList li {} #content ol.courseList li * {padding-left: 0; margin-left: 0;} #content ol.courseList li h3 {font-size: 14px;} #content ol.courseList li ul {list-style: none;} #content ol.courseList li ul li {} #content ol.courseList li ul li h4 {font-size: 13px;} #content ol.courseList dl {font-size: 11px;} #content ol.courseList dl dt {} #content ol.courseList dl dd {padding-left: 21px; padding-bottom: 10px;} /** Summer School **/ form#summer {padding-left: 42px; width: 220px;} form#summer {font-size: 11px;} form#summer fieldset {} form#summer fieldset ol {} form#summer fieldset ol li {padding: 5px;} form#summer fieldset ol li {clear: both;} form#summer fieldset ol li label {display: block; width: 40px;} form#summer fieldset ol li label {float: left; clear: none;} form#summer fieldset ol li input {display: block; width: 130px;} form#summer fieldset ol li input {float: right; clear: none;} form#summer fieldset ol li.submit {display: block; padding-right: 6px;} form#summer fieldset ol li.submit {text-align: right;} form#summer fieldset ol li.submit input {display: inline; width: auto;} /** Footer **/ div#footer {padding-bottom: 30px; margin-top:20px;} div#footer {font-size: 10px; color: #999999; text-align: center; background: #ffffff;} div#footer {clear: both;} #footer p {display: block; padding: 10px 35px 10px 35px; margin-top: 0; height: 50px;} #footer p {border-top: 24px solid #999999;} #footer p {clear: both;} #footer ul {text-align: center; padding-top: 0;} #footer ul li {width: auto; padding: 0 5px;} #footer ul li {border-left: 1px solid #993333; line-height: 11px;} #footer ul li {float: left;} #footer ul li.first {border-left: none;} #footer ul li a {color: #993333; text-decoration: underline; font-size: 11px;} /** Share With a Friend **/ div#share {padding-left: 21px;} #share form {} #share form fieldset {display: block; width: 700px; padding-left: 21px;} #share form fieldset {background: #a84a4a url( /images/refer_bg.jpg ) repeat-x; border: 1px solid #cccccc;} #share form fieldset legend {padding-left: 50px; padding-right: 50px; margin-left: 8px;} #share form fieldset legend {border: 1px solid #cccccc; background-color: #ffffff; font-size: 10px; font-weight: bold; color: #666666;} #share form fieldset ol {font-size: 11px;} #share form fieldset ol li {float: left; clear: right;} #share form fieldset ol li {margin-right: 5px;} #share form fieldset ol li label {display: block; margin-bottom: 2px;} #share form fieldset ol li label {color: #666666;} #share form fieldset ol li input {width: 127px;} #share form fieldset ol li textarea {width: 127px;} div#share form fieldset ol li.submitItem {padding-top: 10px; width: 677px;} div#share form fieldset ol li.submitItem {clear: left; /*float: right;*/ text-align: right;} #share form fieldset ol li.submitItem input {width: auto; display: inline;} #share form fieldset ol li.submitItem input {} #share form fieldset ol li.submitItem input {clear: left;} #share form fieldset p {padding-bottom: 10px;} #share form fieldset p {font-size: 11px; color: #ffffff;} #share form fieldset p {clear: both;} /** Terms **/ div#content dl {padding:0 21px;} div#content dl {font-size:11px;} div#content dl dt {margin:11px 0 11px 0;} /** Box-model hacks for IE5 **/ #topNav ul li a {\width: 125px; w\idth: 124px;} #topNav ul li a.first {\width: 125px; w\idth: 123px;} #topNav ul li ul li a {\width: 240px; w\idth: 232px;} #leftColumn p#dobsonQuote {\width: 141px; w\idth: 120px;} a#student {\width: 119px; w\idth: 98px;} #content ul.articleLinkList li h4 {\height: 75px; he\ight: 50px;} #content ul.articleLinkList li ul {} div#share form fieldset ol li.submitItem {\width: 660px; w\idth: 677px;} form#summer {\width: 262px; w\idth: 220px;} #faqAnswers { margin: 0 20px 0 20px; font-size:11px; } #faqAnswers p{ padding:0; } #faqAnswers h4{ font-size:12px; } /* Facebook Send Button */ .fb-send-button { -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; cursor: pointer; color: #3b5998; -moz-outline-style: none; text-decoration: none; background: #eceef5; border: 1px solid #cad4e7; display: inline-block; padding: 4px 5px; white-space: nowrap; padding: 2px 5px; font-family: 'Arial', sans-serif; font-size: 11px; } .fb-send-button:hover { border-color: #9dacce; text-decoration: none; color: #3b5998; } .fb-send-button span { line-height: 20px; line-height: 19px; } .fb-send-button i, .fb-send-button img { float: left; height: 18px; margin-right: 3px; width: 14px; } .fb-send-button i { background-image: url(http://static.ak.fbcdn.net/rsrc.php/v1/z7/r/ql9vukDCc4R.png); background-position: -1px -45px; }