@import url('reset.css');
@import url('color.css');
@import url('typography.css');

/* CSS LAYOUT
---------------------------------------------- */

#container { z-index: 2000; position: relative; width: 984px; margin: 0 auto; text-align: left; overflow: hidden; }

/* BRANDING
---------------------------------------------- */

#branding { position: relative; width: 100%; height: 391px; }
#branding h1 a { z-index: 1000; display: block; position: absolute; top: 0; left: 422px; width: 145px; height: 145px; text-indent: -9999px; cursor: pointer; }

.mission, .vocation { position: absolute; top: 0; width: 179px; height: 284px; }
.mission { left: 68px; }
.vocation { right: 64px; }

.mission h2, .vocation h2 { position: relative; width: 170px; height: 27px; margin: 0; text-indent: -9999px; }
.mission h2 { left: 1px; }
.mission p { padding: 10px 12px 0 15px; }
.mission p a { display: block; margin-left: 80px; }

.vocation h2 { left: 8px; }
.vocation p { padding: 10px 8px 0 23px; }
.vocation p a { position: absolute; bottom: 115px; left: 23px; }

/* SITE NAVIGATION
---------------------------------------------- */

ul.sf-menu { position: relative; top: 312px; height: 80px; }

ul.sf-menu li a { display: block; position: absolute; text-indent: -9999px; }
ul.sf-menu .home a, ul.sf-menu .about a, ul.sf-menu li.vocations a { top: 0; height: 27px; }

ul.sf-menu li.home a { left: 315px; width: 85px; }
ul.sf-menu li.about a { left: 441px; width: 100px; }
ul.sf-menu li.vocations a { left: 569px; width: 110px; }

ul.sf-menu .donate a, ul.sf-menu .news a, ul.sf-menu .resources a, ul.sf-menu .contact a
{ width: 139px; height: 26px; top: 53px; }

ul.sf-menu .donate a { left: 196px; }
ul.sf-menu li.news a { left: 342px; }
ul.sf-menu li.resources a { right: 357px; }
ul.sf-menu li.contact a { right: 211px; }

/* SUB NAVIGATION
---------------------------------------------- */

ul.sf-menu li .subNav { position: absolute; width: 145px; z-index: 3000; visibility: hidden; }
ul.sf-menu li .subNav li a { position: relative; display: block; margin: 0; padding: 8px 13px; width: auto; height: auto; left: 0; top: 0; text-align: left; background: none; text-indent: 0; }
ul.sf-menu li:sfHover .subNav { visibility: visible; }

ul.sf-menu li.about .subNav { left: 440px; top: 28px; }
ul.sf-menu li.vocations .subNav { left: 570px; top: 28px; }
ul.sf-menu li.news .subNav { left: 342px; top: 79px; }
ul.sf-menu li.resources .subNav { left: 488px; top: 79px; }


/* CONTENT
---------------------------------------------- */

#content, #subContent { float: left; position: relative; }

#content { left: 60px; width: 584px; }
#content .cb { padding: 80px 0 16px; min-height: 1300px; }
#content .cb.min { min-height: 600px !important; }
#content h2, #content ul, #content ol, #content p, #content dl { margin: 0 38px; }
#content h2.pageNav { position: absolute; top: -9999px; }
#content p.style1 { padding-bottom: 30px; margin-bottom: 20px; }

#content .leadImageBorder { margin: 5px 0 8px 36px; width: 517px; height: 172px; }
#content .leadImageBorder span.leadImage { position: relative; top: 2px; left: 4px; display: block; width: 509px; height: 164px; overflow: hidden; }

/* PAGE NAVIGATION
---------------------------------------------- */

.pageNav { overflow: hidden; margin: 48px 0; }
.pageNav h2 { position: absolute; top: -9999px; }
.pageNav ol { float: left; }
#content .pageNav ul { height: 1.5em; position: relative; margin: 0; }
.pageNav ol li { float: left; }
.pageNav ul li.next { position: absolute; right: 145px; }
.pageNav ul li.last { position: absolute; right: 40px; }
.pageNav ol li { margin: 0 3px; }
.pageNav ul li { padding-left: 13px; margin-right: 20px; }


/* SUB CONTENT
---------------------------------------------- */

#subContent { z-index: 1000; left: 51px; width: 331px; }
#subContent .scb { position: relative; padding: 48px 0 6px; }
#subContent .signup, #subContent .login, #subContent .featuredFriar, #subContent .webBlog, #subContent .blogArchives, #subContent .categories { position: relative; margin: 0 19px 24px; }

#subContent .featuredFriar h2, #subContent .webBlog h2, #subContent .blogArchives h2, #subContent .categories h2 { display: block; width: 292px; height: 31px; margin: 0; text-indent: -9999px; }

/* FORM SIGNUP FOR BLOG
---------------------------------------------- */

.signup legend span { height: 31px; width: 293px; display: block; text-indent: -9999px; }
.signup button { position: relative; margin: 0 13px 13px; width: 89px; height: 19px; cursor: pointer; }
.signup button span { position: absolute; top: -9999px; }
.signup input { width: 137px; }
.signup li { margin-bottom: 13px; }
.signup ol { padding: 13px 13px 0; }

/* MEMBER LOGIN
---------------------------------------------- */

.login legend span { height: 31px; width: 293px; display: block; text-indent: -9999px; }
.login button { position: relative; width: 89px; height: 19px; cursor: pointer; }
.login button span { position: absolute; top: -9999px; }
.login input { width: 137px; }
.login li { margin-bottom: 13px; clear: left; width: 100%; }
.login label { float: left; display: block; width: 6em; }
.login ol { padding: 13px 13px 0; }
html*:first-of-type .login fieldset.submit { position: absolute; top: 6px; }
.login fieldset.submit { position: absolute; top: 3px; right: 14px; }

/* SUB CONTENT FEATURED FRIAR
---------------------------------------------- */

#subContent .featuredFriar { position: relative; overflow: hidden; padding-bottom: 18px; }
#subContent .ffLead { float: left; margin: 18px 13px 8px; width: 88px; height: 101px }
.ffLead span, .ffLead span a { display: block; width: 88px; height: 101px; }
.ffLead span a { text-indent: -9999px; }
#subContent .featuredFriar h3 { margin: 16px 0 6px; }
#subContent .featuredFriar blockquote p { clear: none; margin: 0 32px 24px 13px; }
#subContent .featuredFriar p { clear: left; margin: 24px 13px 0; }

/* CONTENT FEATURED FRIAR
---------------------------------------------- */

#content .ffLead { float: left; margin: 0; width: 88px; height: 101px; margin-right: 10px; }
#content .featuredFriar blockquote { margin: 12px 40px 20px; padding: 10px; overflow: hidden; }
#content .featuredFriar p { margin-bottom: 24px; }
#content .featuredFriar blockquote p { margin: 0; }


/* YOU TUBE VIDEO
---------------------------------------------- */

#subContent #video1 { width: 292px; height: 244px; margin: 0 auto 24px; }
#subContent #video1 embed,
#subContent #video1 object { width: 292px; height: 244px; }

/* CONTENT BLOG
---------------------------------------------- */

.blog { margin-top: 12px; }
.blog h3 { margin: 0 20px 0 38px; display: inline; }
.blog p { padding: 3px 0 12px; }
#content .blog p.comments { margin: 0 30px 32px; padding: 3px 10px; }

/* SUB CONTENT WEB BLOG
---------------------------------------------- */

.webBlog ul { padding-bottom: 20px; }
.webBlog li { padding: 13px 13px 0; }

/* DEFINITIONS
---------------------------------------------- */

dl dd { margin-bottom: 24px; }
dl dt { margin-bottom: 0; }
#content dl dd p { margin: 0; }

/* LINKS
---------------------------------------------- */

#content .links dl.linksList { margin-top: 8px; padding-top: 24px; }
#content .links h2 { padding-bottom: 12px; margin-bottom: 10px; }
#content .links p.addUrl { clear: left; }
#content .links div.category { margin: 0 38px 24px; }
#content .links ul.linkCategories { overflow: hidden; margin-bottom: 24px; }
#content .links ul.linkCategories li { list-style-position: inside; list-style-type: square; float: left; width: 50%; }
#content .links ul.guidelines { list-style-position: inside; list-style-type: square; margin-bottom: 24px; }
#content .links ol.pagination { overflow: hidden; padding: 12px 0; }
#content .links ol.pagination li { float: left; padding-right: 6px; }

#content .links fieldset.links li.submit button {  }
#content .links fieldset.links input { width: 264px; }

/* CONTACT
---------------------------------------------- */

#contact { position: relative; height: 590px; }
#contact h3 { margin: 0 40px; }
#contact .org { position: absolute; top: 540px; width: 100%; height: 10px; text-indent: -9999px; }
#contact .tel, #contact .email { position: absolute; top: 325px; padding-top: 80px; }
#contact .tel h3, #contact .email h3 { margin: 0; }
#contact .fax, #contact .adr { position: absolute; top: 460px; }
#contact .fax h3, #contact .adr h3 { margin: 0; }
#contact .tel, #contact .fax { left: 163px; }
#contact .email, #contact .adr { left: 292px; }

/* CONTACT VOCATION DIRECTOR
---------------------------------------------- */

#content .contactDirector { position: relative; padding: 32px 24px 0; margin-top: -12px; }
#content .contactDirector legend span { position: relative; display: block; top: 24px; }
#content .contactDirector ol { margin: 0; overflow: hidden; }
#content .contactDirector li { clear: left; margin-bottom: .5em; width: 100%; }
#content .contactDirector label { display: block; float: left; width: 35px; }
#content .contactDirector label.comments { float: none; width: 200px; }
.contactDirector textarea { width: 204px; height: 48px; }

#content .contactDirector .submit { margin: 0; }
#content .contactDirector .submit button { width: 89px; height: 18px; cursor: pointer; }
#content .contactDirector .submit button span { position: absolute; top: -9999px; }

/* VIDEOS
---------------------------------------------- */

.videos { margin-top: 6px; padding: 48px 0; }
.videos img { float: left; margin: 0 12px 24px 0; }
.videos li { overflow: hidden; clear: left; margin-bottom: 12px;  }
.videos h3 { font-weight: 700; text-transform: uppercase; display: inline; }

/* VIDEO SUB
---------------------------------------------- */

#videoScreen { width: 500px; margin: 0 auto; margin-top: 6px; padding-top: 48px; }

.subviddesc { width: 489px; margin: 8px auto; }
.subviddesc .svdb { padding-bottom: 32px; }
.subviddesc h3 { height: 30px; display: block; text-indent: -9999px; }
.subviddesc .info { margin: 0 24px; padding-top: 8px; }
.subviddesc .info strong { display: block; }
.subviddesc .info h3 { padding-top: 28px; margin-top: 8px; height: auto; text-indent: 0; }
#content .subviddesc .info p { margin: 0; }

/* PHOTO ALBUM INDEX
---------------------------------------------- */

#content .photoAlbum { margin-bottom: 24px; }
#content .photoAlbum p { margin-bottom: 24px; }
#content .photoAlbum ul { padding-top: 48px; overflow: hidden; display: block; clear: left; position: relative; }
.photoAlbum li { float: left; width: 50%; position: relative; height: 160px; }
.photoAlbum li h3 { position: relative; top: 6px; left: 74px; }
.photoAlbum li p.description { position: relative; left: 74px; margin: 6px 80px 0 0 !important; }
.photoAlbum li a.thumb { position: absolute; top: 8px; left: 8px; display: block; width: 51px; height: 51px; text-indent: -9999px; }


/* PHOTO GALLERY
---------------------------------------------- */

#content .photoGallery p { margin-bottom: 24px; }
.photoGallery h3 { position: relative; height: 2.17em; margin: 0 40px; }
.photoGallery h3 span { position: absolute; top: 4px; left: 12px; }

.scroll { position: relative; margin: 24px 65px; }
/* TEMP CHANGE, NO SCROLL HEIGHT .scroll { position: relative; height: 67px; margin: 24px 65px; } */
#content .scrollContainer { overflow: hidden; margin: 0; }
.scrollContainer li { position: relative; display: inline; float: left; margin: 0 3px 12px 5px; height: 66px; width: 67px; }
.scrollContainer li a { position: absolute; top: 8px; left: 8px; width: 51px; height: 51px; display: block; text-indent: -9999px; }

#content ul.control { position: relative; margin: 0; top: -112px; }
#content ul.control li a { position: absolute; top: 45px; width: 16px; height: 18px; display: block; text-indent: -9999px; cursor: pointer; }

#content ul.control .prev a { left: 40px; }
#content ul.control .next a { right: 40px; }


/* SEARCH
---------------------------------------------- */

.searchContainer { margin-top: 6px; padding: 48px 0; }
.search { width: 375px; margin: 20px auto 24px; }
.search .sb { padding: 1.5em 0 1em; }
.search legend span { position: absolute; display: block; top: -9999px; }
.search li { padding-bottom: .5em; }
.search label { display: block; padding-bottom: .5em; }

.search input { width: 300px; }
.search li.submit button { width: 89px; height: 18px; cursor: pointer; }
.search li.submit button span { position: absolute; top: -9999px; }


/* BLOG SUB
---------------------------------------------- */

.post { margin-bottom: 48px; }
#content .post p { margin-bottom: 24px; }
.post .date { display: block; margin: 0 40px 12px; }
#content .cb.min .post img { display: block; max-width: 480px; float: none; }

/* NEWS SIDE BAR
---------------------------------------------- */

.blogArchives ul, .categories ul { padding: 12px 0 48px 32px; }

/* BLOG COMMENTS
---------------------------------------------- */

#content div.comments { padding-top: 38px; margin: 38px; }
#content div.comments h2 { margin: 0 0 24px; }
#content div.comments ol { margin: 0 0 24px; }
.comments ol li { padding: 12px; }
#content div.comments ol p { margin: 12px 0 12px 0; padding: 0; }
#content div.comments ol p:first-child { margin-bottom: 24px; }


/* CONTENT FORM
---------------------------------------------- */

.contentForm { width: 424px; margin: 0 auto; }
.contentForm fieldset { padding: 24px 0; }
.contentForm legend span { display: block; width: 424px; height: 30px; text-indent: -9999px; }
#content .contentForm ol { clear: left; float: none; display: block; margin: 0; overflow: hidden; }
#content .contentForm li { clear: left; float: left; padding: 0; margin-bottom: .7em; width: 100%; }
.contentForm li.submit { position: relative; height: 18px; }
.contentForm li.submit button { position: absolute; top: 0; right: 44px; width: 89px; height: 18px; cursor: pointer; }
.contentForm li.submit button span { position: absolute; top: -9999px; }
.contentForm label { display: block; width: 100px; margin-right: 1em; text-align: right; float: left; }

.contentForm input { width: 137px; }
.contentForm textarea { width: 263px; height: 109px; }

/* NEWSLETTER
---------------------------------------------- */

.colOne ul.download {  }

.colOne li.issue { padding: 12px 0; text-align: center; }
.colOne li.issue strong { display: block; }
.colOne li.downloadNow { text-align: center; padding-bottom: 32px; }
.colOne li.downloadNow a { height: 114px; display: block; text-indent: -9999px; }
.colOne li.getAdobe a { height: 33px; display: block; text-indent: -9999px; }
.colOne li.getAdobe { padding: 12px 0; }

.colTwo p { padding: 12px 0 12px 20px; }

.colTwo ul.archives { padding-bottom: 48px; }
.colTwo ul.archives li { padding-left: 40px;  }

/* CONTENT COLS
---------------------------------------------- */

.newsletter { margin-top: 6px; }
#content .contentCols ul, #content .contentCols p { margin: 0; }
#content .contentCols { position: relative; padding-top: 32px; margin-top: 12px; }
.colOne, .colTwo { width: 256px; }
.colOne { position: absolute; top: 32px; left: 24px; }
.colTwo { position: relative; left: 52%; }
.colb { padding-bottom: 13px; min-height: 320px; }
#content .contentCols h3 { height: 29px; text-indent: -9999px; }


/* VOCATION PRAYER & EXPLORE VOCATION
---------------------------------------------- */

#content dl.vocations { margin-top: 24px; margin-bottom: 24px; padding-bottom: 6px; }

#content .vocationSup { position: relative; padding: 48px 0 0; margin-top: 32px; }
.vocationPrayer, .exploreVocation { width: 256px; }
.vocationPrayer { position: relative; left: 24px; }
.exploreVocation { position: absolute; top: 48px; right: 24px; }
.vpb, .evb { padding-bottom: 13px; min-height: 465px; }
.vocationPrayer h3, .exploreVocation h3 { height: 29px; text-indent: -9999px; margin-bottom: 12px; }
#content .vocationPrayer p { margin: 0 24px 12px; }
.exploreVocation blockquote { padding-top: 70px; }
#content .exploreVocation p { margin: 0 24px 12px; }
#content .exploreVocation ul { margin: 0 24px 0 42px; }
#content .exploreVocation ul li { margin-bottom: 12px; }
#content .exploreVocation ul li.contact { position: absolute; bottom: 0; right: 24px; }
#content .vocationPrayer p.amen { margin: -12px 24px 0; }

/* FACEBOOK IFRAME
---------------------------------------------- */

#faceWrap { margin: 0 38px; padding: 30px 0 0; }



/* FORMATION
---------------------------------------------- */

#content .formation { position: relative; height: 200px; margin: 24px 54px; }
#content .formation li { position: absolute; width: 128px; height: inherit; }
#content .formation li a { position: absolute; top: 0; width: 95px; display: block; text-indent: -9999px; }

.formation li.prenovitiate { left: 0; }
.formation li.novitiate { left: 128px; }
.formation li.theological { left: 256px; }
.formation li.ongoing { left: 384px; }

.formation li.prenovitiate a, .formation li.novitiate a { height: 143px; }
.formation li.theological a, .formation li.ongoing a { height: 161px; }

/* FAQ
---------------------------------------------- */

#content .faqQuestions { margin: 12px 38px 24px; padding-bottom: 32px; }
#content .faqQuestions li { margin-left: 48px; }
#content .faq h3 { margin: 0 38px; }
#content .faq .faqAnswers li { margin-bottom: 2em; }
#content .faq li h3 { margin: 0; }
#content .faq p { margin: 0; }
#content .faq span.top { display: block; padding: 12px 0; margin-left: 455px; }

/* HISTORY
---------------------------------------------- */

#content .history p { margin-bottom: 24px; }

/* FOUR PILLARS
---------------------------------------------- */

#content .fourPillars h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .fourPillars p { margin-bottom: 24px; }

/* MINISTRIES
---------------------------------------------- */

#content .ministries h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .ministries p { margin-bottom: 24px; }
#content .ministries ul { margin: 0 24px; }

/* DISCERNMENT
---------------------------------------------- */

#content .discernment h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .discernment p { margin-bottom: 24px; }
#content .discernment ul { margin: 0 24px; }
#content .discernment dd cite { display: inline; }

/* NOVITIATE
---------------------------------------------- */

#content .novitiate { overflow: hidden; }
#content .novitiate h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .novitiate p { margin-bottom: 24px; }
#content .novitiate img.leadImage { float: right; margin: 0 38px 12px 24px; }

/* STUDENTATE
---------------------------------------------- */

#content .studentate h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .studentate p { margin-bottom: 24px; }

/* ADMISSION
---------------------------------------------- */

#content .admission h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .admission p { margin-bottom: 24px; }
#content .admission ul { margin: 0 24px; }

/* PARENTS
---------------------------------------------- */

#content .parents h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .parents h3 { margin: 0 38px; }
#content .parents p { margin-bottom: 24px; }
#content .parents ul { margin: 0 52px 24px; }
#content .parents li p { margin: 0; }

/* WHO WE ARE
---------------------------------------------- */

#content .whoweare p { margin-bottom: 24px; }
#content .whoweare h2 { padding-bottom: 12px; margin-bottom: 12px; margin-right: 0; }
#content .whoweare blockquote.genesis { display: block; margin-bottom: 24px; }

#content .whoweare .passage { text-align: center; }
#content .whoweare .passageThought { text-align: center; }

/* COME AND SEE
---------------------------------------------- */

blockquote p cite { display: block; }
#content .parts li p { margin: 0; padding: 10px 0 0 0; }
#content .parts li.calendar p { /* padding: 10px 215px 64px 0; */ padding: 10px 0 64px 0; }
#content .parts { margin-top: 24px; }
.parts li { position: relative; padding-bottom: 24px; }
.parts li.partFour { padding-bottom: 30px; }
.parts li.partOne img { float: left; margin: 20px 20px 0 0; }
.parts li.partTwo img { float: right; margin: 20px 0 0 20px; }
.parts li.partThree img { float: left; margin: 20px 20px 0 0; }
.parts li.partFour img { float: right; margin: 20px 0 0 20px; }
.parts li h3 { text-indent: -9999px; height: 26px; }
.parts li div.extraStyle2 { position: absolute; top: -10px; right: 20px; width: 155px; height: 199px; }

/* DONATION FORM
---------------------------------------------- */

.donations { padding-bottom: 12px; margin-bottom: 50px; }
#content .donations h2 { padding-bottom: 12px; margin-bottom: 24px; margin-right: 0; }
#content .donations p { margin-bottom: 24px; }
#content .donations ul { margin: 0 62px 24px; }

.donationForm { width: 424px; margin: 0 auto; }
.donationForm .db { padding-bottom: 12px; }
.donationForm legend span { display: block; position: relative; }
.donationForm legend.head span { width: 424px; height: 30px; text-indent: -9999px; }
#content .donationForm p { margin: 0; padding: 10px 24px 20px; }
#content .donationForm input { width: 138px; }
#content .donationForm ol { margin: 0; position: relative; }
.donationForm button { cursor: pointer; width: 89px; height: 18px; margin: 0; padding: 0; }
.donationForm button span { position: absolute; top: -9999px; }
.donationForm li { margin-bottom: .7em; width: 100%; clear: left; }
.donationForm label { display: block; float: left; display: inline; }

.donationForm .vocationSupport { padding: .7em 0 28px; }
.donationForm .vocationSupport label { text-align: right; margin: 0 20px 0 128px; width: 100px; }
.donationForm .vocationSupport legend span { left: 130px; }
.donationForm .vocationSupport li.total { display: none; text-align: right; }
.donationForm .vocationSupport li.total span { margin-right: 19px; }
.donationForm .vocationSupport li.updateTotal { position: relative; height: 18px; }
.donationForm .vocationSupport li.updateTotal button { position: absolute; right: 22px; padding: 0; cursor: pointer; }
.donationForm .vocationSupport input { margin-left: 6px; }

.donationForm .login { padding: .7em 0 64px 0; margin-top: 12px; }
.donationForm .login label { text-align: left; margin: 0 6px 0 128px; width: 70px; }
.donationForm .login legend span { left: 20px; }
.donationForm .login li.login { height: 18px; margin: 0; padding: 0; }
.donationForm .login li.login button { position: absolute; right: 76px; }

.donationForm .forgotPass a, .donationForm .register a
{ position: absolute; left: 258px; }
.donationForm .forgotPass a { top: 7.6em; }
.donationForm .register a { top: 9em; }

/* FOOTER
---------------------------------------------- */

#footer { clear: left; text-align: left; position: relative; width: 100%; height: 157px; margin-top: -68px; }

/* COMPANY INFO
---------------------------------------------- */

#companyInfo { position: relative; top: 68px; width: 984px; margin: 0 auto; padding-bottom: 24px; }
#companyInfo h2 { position: absolute; top: 12px; left: 67px; }
#companyInfo #sharethis_0 { position: relative; top: 10px; left: 67px; }
#companyInfo .vcard { overflow: visible; position: absolute; top: 10px; right: 349px; }
#companyInfo .ocean { position: relative; left: 67px; width: 568px; margin-top: 10px; clear: left; text-align: right; }
#companyInfo .ocean img { position: relative; top: 5px; }

/* FORMS
---------------------------------------------- */

input, textarea { padding: 1px; }

/* ALERT MESSAGE
---------------------------------------------- */

#content div.message { display: none; margin: 0 84px; }
#content div.message #alert ul li { list-style: disc outside; }
#content .vocationSup div.message { display: none; margin: 0 0 0 308px; width: 256px; }