/********************************************************************************************************************/ /********* RESET STYLESHEET IS A MODIFIED VERSION OF ERIC MEYER'S 'RESET RELOADED STYLESHEET *************************/ /********************************************************************************************************************/ html, body, div, span, applet, object, iframe, 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, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0; outline:0;font-family:Tahoma, Helvetica, sans-serif;font-size:13px;line-height:20px;letter-spacing:.05em;font-style:inherit;font-weight: normal;text-align:left;color:#8c8b8b;} :focus {outline: 0;} ul, ol {list-style:none;} caption {text-align:left;font-weight:normal;} em {font-style:italic;} strong {font-weight:bold;} sup {font-size:0.7em;vertical-align:top;} blockquote:before, blockquote:after, q:before, q:after {content: "";} blockquote, q {quotes:"" "";} /* remove borders from linked images */ a img {border:none;} /* tables still need cellspacing to match in the markup */ table {border-collapse:separate;} th, td {text-align:left;font-weight:normal;vertical-align:top;} /********************************************************************************************************************/ /***************************************** * GLOBAL PREDICTABLE ELEMENTS * *******************************************/ /********************************************************************************************************************/ body {background:#000;margin:0;margin-top:20px;} /* DEFAULT HEADER STYLES ***********************************************************************************************************************/ h1, h2, h3, h4, h5, .head {color:#ccc;font-weight:normal;} h1 {} h2 {background-color:#efefef;font-size:14px;line-height:24px;text-indent:5px;} h3 {color:#333;font-size:14px;line-height:24px;} .head {color:#333;font-size:14px;} /* DEFAULT LINK STYLES ***********************************************************************************************************************/ a, a:visited, a:focus {color:#fff;text-decoration:none;} a:hover {color:#efefef;text-decoration:underline;} /* DEFAULT TEXT STYLES ***********************************************************************************************************************/ p {padding:5px 0;margin:0;} /* OTHER REPEATED STYLES ***********************************************************************************************************************/ img.dropCap {float:left;display:inline;margin:7px 5px 5px 0;} /********************************************************************************************************************/ /*****************************************GLOBAL LAYOUT ELEMENTS *****************************************************/ /********************************************************************************************************************/ #wrapper {width:950px;margin:0 auto;} #content {float:left;display:inline;width:900px;padding:25px;} /* logo / top image area (taller on the home page) *******************************************************************************************/ .mast {float:left;display:inline;width:900px;height:100px;} body.home .mast {float:left;display:inline;width:900px;height:120px;} /* logo on all pages EXCEPT the home page */ .mast .logo {float:left;display:inline;width:189px;height:75px;} .mast .logo a {display:block;width:189px;height:75px;background-image: url(../images/logo.gif); background-repeat:no-repeat;} /* logo on home page */ body.home .mast .logo {float:left;display:inline;width:276px;height:109px;} body.home .mast .logo a {display:block;width:276px;height:109px;background-image: url(../images/logo_home.gif); background-repeat:no-repeat;} /* !!!!!!! top images !!!!!!!!!!!!!! */ body.home .mast .image {float:left;display:inline;width:450px;height:109px;background-image: url(../images/mast_home.jpg); background-repeat:no-repeat;margin-left:25px;} body.contact .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_contact.jpg); background-repeat:no-repeat;} body.supportUs .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_supportUs.jpg); background-repeat:no-repeat;} body.press .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_press.jpg); background-repeat:no-repeat;} body.congregation .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_congregation.jpg); background-repeat:no-repeat;} body.history .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_history.jpg); background-repeat:no-repeat;} body.virtualTour .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_virtualTour.jpg); background-repeat:no-repeat;} body.visitorCenter .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_visitorCenter.jpg); background-repeat:no-repeat;} body.designStore .mast .image {float:left;display:inline;width:710px;height:75px;background-image: url(../images/mast_designStore.jpg); background-repeat:no-repeat;} /* menu, primary navigation *******************************************************************************************/ .menu, .bottom {float:left;display:inline;width:900px;height:31px;} .menu ul {float:right;display:inline;width:900px;} .menu li {float:right;display:inline;position:relative;height:29px;margin-right:7px;} .menu li a, .bottom li a {float:left;display:inline;position:relative;height:29px;border:1px solid #000;} .menu li a.current, .menu li a:hover, .bottom li a.current, .bottom li a:hover {border:1px solid #f15834;} .bottom {border-bottom:0;border-top:1px solid #5a5758;} /* per page menu items, top */ .menu li.supportUs {width:106px;background-image: url(../images/menu_supportus.gif); background-repeat:no-repeat;background-position:center;} .menu li.supportUs a {width:106px;} .menu li.tour {width:122px;background-image: url(../images/menu_tour.gif); background-repeat:no-repeat;background-position:center;} .menu li.tour a {width:122px;} .menu li.history {width:80px;background-image: url(../images/menu_history.gif); background-repeat:no-repeat;background-position:center;} .menu li.history a {width:80px;} .menu li.store {width:124px;background-image: url(../images/menu_store.gif); background-repeat:no-repeat;background-position:center;} .menu li.store a {width:124px;} .menu li.visit {width:56px;background-image: url(../images/menu_visit.gif); background-repeat:no-repeat;background-position:center;} .menu li.visit a {width:56px;} .menu li.contact {width:88px;background-image: url(../images/menu_contact.gif); background-repeat:no-repeat;background-position:center;} .menu li.contact a {width:88px;} .menu li.press {width:59px;background-image: url(../images/menu_press.gif); background-repeat:no-repeat;background-position:center;} .menu li.press a {width:59px;} .menu li.congregation {width:139px;background-image: url(../images/menu_congregation.gif); background-repeat:no-repeat;background-position:center;} .menu li.congregation a {width:139px;} /* per page menu items, bottom */ .bottom li.history {width:80px;background-image: url(../images/menu_history.gif); background-repeat:no-repeat;background-position:center;} .bottom li.history a {width:80px;} .bottom li.virtualTour {width:122px;background-image: url(../images/menu_virtualTour.gif); background-repeat:no-repeat;background-position:center;} .bottom li.virtualTour a {width:122px;} .bottom li.visitorCenter {width:138px;background-image: url(../images/menu_visitorCenter.gif); background-repeat:no-repeat;background-position:center;} .menu li.visitorCenter a {width:138px;} .bottom li.designStore {width:124px;background-image: url(../images/menu_designStore.gif); background-repeat:no-repeat;background-position:center;} .bottom li.designStore a {width:124px;} .changingContent {float:left;display:inline;width:900px;border-top:1px solid #5a5758;} /********************************************************************************************************************/ /***************************************** PER PAGE *****************************************************/ /********************************************************************************************************************/ /* HOME *********************************************************************************************************************************************/ /* home, leftCol */ body.home .leftCol {float:left;display:inline;width:600px;border-right:0px solid #5a5758;} body.home .leftCol p {padding:20px;font-size:13px;line-height:26px;color:#fff;} /* image links along bottom row */ body.home .leftCol .bottomRow {float:left;display:inline;width:600px;border-top:1px solid #5a5758;} body.home .leftCol .bottomRow li {float:left;display:inline;position:relative;width:149px;border-right:1px solid #5a5758;} body.home .leftCol .bottomRow li a {float:left;display:inline;width:149px;height:115px;} /* removes the right-most li border */ body.home .leftCol .bottomRow li.right {border-right:0;} /* sets images as backgrounds for each respective li > a (the boxes) */ body.home .leftCol .bottomRow li.history a {background-image: url(../images/home_bottomRowHistory.gif); background-repeat:no-repeat;background-position:center;} body.home .leftCol .bottomRow li.virtualTour a {background-image: url(../images/home_bottomRowVirtualTour.gif); background-repeat:no-repeat;background-position:center;} body.home .leftCol .bottomRow li.visitorCenter a {background-image: url(../images/home_bottomRowVisitorCenter.gif); background-repeat:no-repeat;background-position:center;} body.home .leftCol .bottomRow li.designStore a {background-image: url(../images/home_bottomRowDesignStore.gif); background-repeat:no-repeat;background-position:center;} body.home .leftCol .bottomRow li.history a:hover {background-image: url(../images/home_bottomRowHistory_on.gif);} body.home .leftCol .bottomRow li.virtualTour a:hover {background-image: url(../images/home_bottomRowVirtualTour_on.gif);} body.home .leftCol .bottomRow li.visitorCenter a:hover {background-image: url(../images/home_bottomRowVisitorCenter_on.gif);} body.home .leftCol .bottomRow li.designStore a:hover {background-image: url(../images/home_bottomRowDesignStore_on.gif);} /* home, rightCol */ body.home .rightCol {float:left;display:inline;width:298px;} body.home .rightCol .newsHead { float: left; display: inline; width: 298px; height: 35px; background-image: url(../images/home_newsHead.gif); background-repeat: no-repeat; border-bottom: 1px solid #5a5758; border-right: 1px solid #5a5758; border-left: 1px solid #5a5758; } body.home .rightCol .newsBody {float:left;width:278px;padding:10px;padding-bottom:20px;font-size:17px;line-height:30px;} body.home .rightCol .home_newsBodyImg {float:left;display:inline;width:278px;height:110px;margin-bottom:10px;background-image: url(../images/home_newsBody.jpg); background-repeat:no-repeat;background-position:center;} /* CONTACT *********************************************************************************************************************************************/ /* sets the floats and borders of all cols */ body.contact .col_1, body.contact .col_2, body.contact .col_3, body.contact .col_4 {float:left;display:inline;border-left:1px solid #5a5758;height:500px;} body.contact .col_1_head, body.contact .col_2_head, body.contact .col_3_head, body.contact .col_4_head {float:left;display:inline;height:60px;border-bottom:1px solid #5a5758;} /* sets the widths of all cols */ body.contact .col_1, body.contact .col_1_head {width:44px;border-left:0;} body.contact .col_2, body.contact .col_2_head {width:284px;} body.contact .col_3, body.contact .col_3_head {width:284px;} body.contact .col_4, body.contact .col_4_head {width:284px;} /* sets the background images of all cols */ body.contact .col_2_head {background: url(../images/contact_head_foundation.gif) no-repeat center;} body.contact .col_3_head {background: url(../images/contact_head_staff.gif) no-repeat center;} body.contact .col_4_head {background: url(../images/contact_head_boardOfDirectors.gif) no-repeat center;} /* indents the ul's used to format the copy */ body.contact .col_1 ul, body.contact .col_2 ul, body.contact .col_3 ul, body.contact .col_4 ul {float:left;display:inline;padding:20px 0;} body.contact .col_1 li, body.contact .col_3 li, body.contact .col_4 li {float:left;display:inline;width:264px;clear:left;margin-left:20px;margin-bottom:12px;} body.contact .col_1 span, body.contact .col_2 span, body.contact .col_3 span, body.contact .col_4 span {color:#fff;} body.contact .col_2 ul {float:left;display:inline;padding:10px 0;} body.contact .col_2 li {float:left;display:inline;width:264px;clear:left;margin-left:20px;margin-bottom:5px;} /* SUPPORT US *********************************************************************************************************************************************/ /* top copy row */ body.supportUs .topCol {float:left;display:inline;width:900px;padding:20px 0;border-bottom:1px solid #5a5758;font-size:17px;line-height:30px;} /* bottom left copy col */ body.supportUs .bottomLeftCol {float:left;display:inline;width:550px;padding:30px;padding-left:0;color:#fff;} body.supportUs .bottomLeftCol ul {float:left;display:inline;width:550px;margin-top:20px;} body.supportUs .bottomLeftCol li {float:left;display:inline;width:550px;padding-left:20px;background: url(../images/bullet.gif) no-repeat; background-position: left;color:#fff;} /* bottom right paypal col */ body.supportUs .bottomRightCol {float:left; display:inline; width:315px; height:200px; border-left:1px solid #5a5758; text-align:center; position:relative;} body.supportUs .bottomRightCol #paypal {float:left; display:inline; width:125px; position:relative; top:70px; left:90px;} /* PRESS *********************************************************************************************************************************************/ body.press .col_1, body.press .col_2, body.press .col_3 {float:left;display:inline;} /* left col with image */ body.press .col_1 {width:425px;height:425px;background: url(../images/press_leftCol.gif) no-repeat; background-position: center;border-left:1px solid #5a5758;} /* middle col with content */ body.press .col_2 {width:405px;border-left:1px solid #5a5758;border-right:1px solid #5a5758;} body.press .col_2 .col_2_head {float:left;display:inline;width:405px;height:60px;border-bottom:1px solid #5a5758;} body.press .col_2 li {float:left;display:inline;width:385px;padding:10px;border-bottom:1px solid #5a5758;} body.press .col_2 li span {color:#fff;} body.press .col_2 li a.pdf {float:right;display:inline;margin-left:20px;font-size:11px;font-weight:bold;} body.press .col_2 li.last {border-bottom:1px solid #5a5758;} body.press .col_2 li.copy {padding:20px 10px;border-bottom:0;} /* right col as empty space */ body.press .col_3 {width:64px;} /* CONGREGATION *********************************************************************************************************************************************/ body.congregation div.changingContent {height:425px;} /* HISTORY *********************************************************************************************************************************************/ body.history .leftCol {float:left;display:inline;width:380px;padding:20px;} /* right col has image links to lighbox content */ body.history .rightCol {float:left;display:inline;width:477px;border-left:1px solid #5a5758;} /* top box */ body.history .topRightCol {float:left;display:inline;width:477px;height:280px;background: url(../images/history/history_topRightCol.gif) no-repeat; background-position: center;border-bottom:1px solid #5a5758;} body.history .topRightCol a {float:left;display:inline;width:477px;height:280px;} /* bottom box */ body.history .bottomRightCol {float:left;display:block;width:477px;height:280px;background: url(../images/history/history_bottomRightCol.gif) no-repeat; background-position: center;} body.history .bottomRightCol a {float:left;display:inline;width:477px;height:280px;} /* VIRTUAL TOUR *********************************************************************************************************************************************/ body.virtualTour .leftCol {float:left;display:inline;width:270px;height:450px;border-right:1px solid #5a5758;} body.virtualTour .leftCol span {color:#fff;} body.virtualTour .rightCol {float:left;display:inline;width:585px;padding:40px 0 20px 40px;} body.virtualTour .rightCol li {float:left;display:inline;margin:0 20px 20px 0;} /* VISITOR CENTER *********************************************************************************************************************************************/ body.visitorCenter .leftCol {float:left;display:inline;width:250px;padding:20px;border-right:1px solid #5a5758;} body.visitorCenter .leftCol span {color:#fff;} body.visitorCenter .rightCol {float:left;display:inline;width:565px;padding:20px;padding-right:10px;} body.visitorCenter .rightCol a.block {display:inline; padding:5px 15px; background:#f15d30; text-align:center; color:#fff; text-decoration:none; margin-bottom:10px;} body.visitorCenter .rightCol a.block:hover {background:#333;} body.visitorCenter .rightCol div {margin:20px 0;} body.visitorCenter .rightCol p {color:#fff;line-height:16px;} /* DESIGN STORE *********************************************************************************************************************************************/ body.designStore .col_1, body.designStore .col_2, body.designStore .col_3 {float:left;display:inline;} /* left col with copy */ body.designStore .col_1 {width:240px;padding:20px;} /* middle col with images */ body.designStore .col_2 {width:500px;border-left:1px solid #5a5758;border-right:1px solid #5a5758;padding: 20px 10px 30px 10px;} body.designStore .col_2 .leftImagesBlock {float:left;width:250px;margin-left:20px;} body.designStore .col_2 .rightImagesBlock {float:left;width:175px;margin:0 20px;} body.designStore .col_2 img {margin-top:10px;} body.designStore .col_2 p {color:#fff;font-size:11px;line-height:14px;} /* right col as empty space */ body.designStore .col_3 {width:70px;} /********************************************************************************************************************/ /***************************************** MODAL STYLES *****************************************************/ /********************************************************************************************************************/ .photo {float:left;display:inline;width:440px;} .copy {float:left;display:inline;margin-left:25px;width:200px;} .attribute {text-align:right; font-size:.8em; color:#fff;}