/****** FILE: themes/st-pauls/css/main.css *****/
body { font-family: Arial, sans-serif; }

a { color: #1a8fce; }

a:link, a:focus, a:visited { color: #1a8fce; }

a:hover, a:active { color: #1a8fce; }

h1, h2, h3, h4, h5, h6 { font-family: "adobe-jenson-pro", serif; color: #002f6c; }

p { line-height: 1.8; }

blockquote { border-left-color: #1a8fce; }

/* Content */
.content img { display: block; max-width: 100%; height: auto; margin-top: 1em; margin-bottom: 1em; float: none; }

.content img.leftAlone { margin-right: 1em; float: left; }

.content img.center { margin-right: auto; margin-left: auto; }

.content img.left { margin-top: 0; margin-right: 1em; float: left; }

.content img.right { margin-top: 0; margin-left: 1em; float: right; }

/******************************************************************************
* General CSS
******************************************************************************/
.container-narrow { min-width: 310px; max-width: 875px; padding-right: 50px; padding-left: 50px; }

@media (max-width: 350px) { .container-narrow { padding-right: 20px; padding-left: 20px; } }

.container-spaced-horiz { max-width: 2500px; margin-right: auto; margin-left: auto; }

@media (min-width: 768px) { .container-spaced-horiz { padding-right: 70px; padding-left: 70px; }
  .withsidebar .container-spaced-horiz { padding-right: 15px; padding-left: 15px; } }

.container-spaced-vert { padding-top: 70px; padding-bottom: 70px; }

.container .container { width: auto; padding: 0; }

.dark-background { background: #002f6c; }

.spacer-15 { height: 15px; margin: 0; padding: 0; }

.text-reversed { color: #fff; }

.text-centered { text-align: center; }

hr { border-top: 1px solid #4990e2; }

/******************************************************************************
* Header
******************************************************************************/
.contact-bar { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; height: 50px; border-bottom: 1px solid #fff; background-color: #002f6c; }

.contact-bar .phone-container { width: 50%; padding-right: 10px; text-align: right; }

.contact-bar .phone-container a, .contact-bar .phone-container a:link, .contact-bar .phone-container a:focus, .contact-bar .phone-container a:visited, .contact-bar .phone-container i { display: inline-block; padding: 5px 0; color: #fff; font-size: 18px; font-weight: bold; }

.contact-bar .phone-container i { margin-right: 10px; }

.contact-bar .search-container { width: 50%; padding-left: 10px; }

.contact-bar .search-container .search-bar { display: block; float: left; }

.contact-bar .search-container .search-bar input { width: 8em; float: left; border: 1px solid #fff; border-radius: 5px; background-color: #002f6c; color: #fff; font-size: 18px; font-weight: bold; text-align: left; -webkit-box-shadow: none; box-shadow: none; }

.contact-bar .search-container .search-bar .input-group-btn { float: left; }

.contact-bar .search-container .search-bar button { margin-left: 0; }

header { position: relative; }

header .header-banner { z-index: -1; }

header .header-content { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 0; left: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 100%; z-index: 1; }

header .header-content p, header .header-content h1, header .header-content h2, header .header-content h3 { color: #fff; text-align: center; }

header .header-content h1 { font-size: 17px; }

header .header-content h2 { font-size: 10px; }

header .header-content div { margin-top: 160px; }

header .header-content p { position: relative; margin-top: 30px; }

header .header-content a { padding: 6px 30px; background-color: #f3ea5d; color: #002f6c; font-size: 13px; z-index: 2; }

.discover-more { position: absolute; bottom: 0; width: 100%; margin-bottom: 50px; text-align: center; cursor: pointer; z-index: 1; }

.discover-more span { color: #fff; font-size: 24px; }

.overlay { position: relative; }

.overlay::after { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 0; left: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 100%; background-color: rgba(0, 16, 37, 0.5); content: ''; }

/******************************************************************************
* Navigation Menu
******************************************************************************/
.nav-column { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 33.333%; float: right; }

.nav-column.left { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-left: 40px; }

.nav-column.center { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.nav-column.right { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding-right: 30px; }

.mainnav { position: absolute; top: 0; right: 0; width: 100%; z-index: 2; }

#open-menu, #close-menu { float: right; cursor: pointer; }

#open-menu .hamburgers, #close-menu .hamburgers { margin-top: 50px; }

#open-menu .hamburgers img, #close-menu .hamburgers img { margin: 0 auto; }

#close-menu { margin-top: 50px; }

#close-menu img { width: 42px; }

.logo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.logo img { width: 80%; margin: 40px auto; }

.nav-container { display: none; position: absolute; top: 0; left: 0; width: 100%; min-height: 100vh; z-index: 5; }

.nav-container::before { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #002f6c; content: ''; opacity: 1; }

.nav-logo { z-index: 5; }

.menu-container { width: 80%; margin-right: auto; margin-left: auto; }

.standard-menu, .mobile-menu { width: 100%; float: left; }

.standard-menu { display: none; }

.mobile-menu { position: relative; margin: 30px auto; }

.mobile-menu h1, .mobile-menu h2, .mobile-menu h3, .menu-list h1, .menu-list h2, .menu-list h3 { margin-top: 36px; color: #f3ea5d; text-align: center; }

.mobile-menu h1:focus, .mobile-menu h2:focus, .mobile-menu h3:focus, .menu-list h1:focus, .menu-list h2:focus, .menu-list h3:focus { outline: 0; }

.mobile-menu h1 span, .mobile-menu h2 span, .mobile-menu h3 span, .menu-list h1 span, .menu-list h2 span, .menu-list h3 span { margin-right: 60px; float: right; font-size: 24px; }

.mobile-menu a, .mobile-menu a:link, .mobile-menu a:focus, .mobile-menu a:visited, .menu-list a, .menu-list a:link, .menu-list a:focus, .menu-list a:visited { display: block; width: 100%; margin: 12px auto; color: #fff; font-size: 16px; text-align: center; }

.mobile-search-bar { position: relative; width: 100%; padding: 0 25px; float: left; }

.mobile-search-bar fieldset { width: 100%; }

.mobile-my-st-pauls { position: relative; width: 100%; margin-top: 20px; margin-bottom: 20px; float: left; }

.mobile-my-st-pauls a { display: block; height: 61px; background-image: url("../images/my-stpaulsLogoLarge.svg"); background-repeat: no-repeat; background-position: 50% 0; background-size: contain; }

.mobile-search-bar .form-control, .search-bar .form-control { border: 1px solid #fff; -webkit-box-shadow: 0; box-shadow: 0; }

.mobile-search-bar button, .search-bar button { background-color: #002f6c; }

.mobile-search-bar i, .search-bar i { color: #fff; font-size: 18px; }

.phone-link { margin-top: 15px; text-align: center; }

.phone-link a, .phone-link a:link, .phone-link a:focus, .phone-link a:visited { color: #fff; font-size: 14px; }

/******************************************************************************
* Breadcrumbs
******************************************************************************/
.breadcrumbs { position: relative; width: 100%; height: 47px; background-color: #002f6c; line-height: 47px; text-align: center; }

.breadcrumbs a, .breadcrumbs span { font-size: 12px; }

.breadcrumbs a { color: #fff; }

.breadcrumbs span { color: #f3ea5d; }

.breadcrumbs .link-break { padding: 0 15px; }

/******************************************************************************
* Home Page
******************************************************************************/
/******************************************************************************
* Page
******************************************************************************/
/******************************************************************************
* Element Styling
******************************************************************************/
.element { margin-top: 40px; }

.element p, .element hr, .element ul { margin: 30px 0; color: #021938; }

.element ul li { margin-top: 15px; }

.element hr { border-top: 1px solid #4990e2; }

.element blockquote { position: relative; padding: 35px 50px 35px 80px; border-left: 0; background-color: rgba(188, 184, 227, 0.15); color: #002f6c; }

.element blockquote::before { position: absolute; top: 35px; left: 30px; font-family: FontAwesome; font-size: 30px; content: '\f10d'; }

.element blockquote p { margin: 0; }

.google-map-container { height: 350px; margin: 35px auto; }

.pagination .current { background: #d8d8d8; color: #021938; }

.ElementUserDefinedFormPanel { margin-top: 0 !important; }

.ElementUserDefinedFormPanel h1 { margin: 40px 0; }

/******************************************************************************
* Side Content
******************************************************************************/
.aside-link-container { position: relative; width: 100%; }

.aside-link-container:first-child { margin-top: 40px; }

.aside-link-container .aside-link { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 120px; margin: 20px auto; }

.aside-link-container .aside-link span { font-family: "adobe-jenson-pro", serif; width: 100%; margin: 0; color: #fff; font-size: 45px; text-align: center; z-index: 1; }

.aside-link-container .aside-link::after { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 16, 37, 0.5); content: ''; }

.aside-document-container { margin: 35px auto 50px; }

.aside-document { position: relative; width: 100%; height: 50px; margin: 16px 0; background-color: #002f6c; }

.aside-document div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100%; float: left; }

.aside-document .document-icon { width: 15%; border-right: solid 2px #fff; }

.aside-document .document-icon img { width: 25px; }

.aside-document .document-title { font-family: "adobe-jenson-pro", serif; width: 85%; color: #fff; font-size: 18px; padding-left: 5px; padding-right: 5px; }

/******************************************************************************
* Forms
******************************************************************************/
/* Styling for form related components Userforms module styling includes a little more than custom forms so that they look finished without needing to modify any code. Extend this style to apply userforms styling to your custom forms, or modify it to change the look of your userforms */
/*	General 	*/
form div.field { margin-bottom: 7.5px; }

form div.field:before, form div.field:after { content: " "; display: table; }

form div.field:after { clear: both; }

form#Form_Form .req-indicator-message { position: relative; font-weight: normal; padding-top: 5px; line-height: 22.5px; padding-right: 10px; display: inline-block; }

form#Form_Form .req-indicator-message:after { content: "*"; position: absolute; right: 0px; text-indent: 0%; }

.alert-error input, textarea, select, .uneditable-input { height: 1.385em; }

/* Styling for messages */
.error-container div { border: 2px solid #ff0000; padding-top: 0; }

.error-container ul { list-style-position: inside; }

.error-container li { padding-top: 6px; }

.error-container a, .error-container a:visited, .error-container a:hover, .error-container a:focus, .error-container a:active, .error-container label { color: #ff0000; text-decoration: none; margin-bottom: 0; cursor: pointer; }

/* Label formatting */
label.left { font-weight: bold; }

label.extra { font-style: italic; }

label.required { float: none; width: 100%; }

.textarea label.required { width: 100%; max-width: 100%; }

span.extra { font-style: italic; display: block; margin-bottom: 7.5px; }

.requiredField label span.req-indicator, .requiredField legend span.req-indicator { position: relative; color: #ff0000; overflow: hidden; text-indent: -999px; display: inline-block; width: 6px; height: 16px; }

.requiredField label span.req-indicator:after, .requiredField legend span.req-indicator:after { content: "*"; position: absolute; left: 0; text-indent: 0%; }

.requiredField.checkbox label.checkbox:after { content: "*"; color: #ff0000; display: inline-block; font-weight: bold; }

legend { font-weight: bold; border-bottom: 0; margin-bottom: 5px; }

/* Form fields formatting */
textarea { width: 100%; height: 200px; }

select, input.text, input.file { width: 100%; height: 2.31em; }

select.date, input.text.date, input.file.date { width: 100px; max-width: 100%; }

#IE7 select.date, #IE7 input.text.date, #IE7 input.file.date { width: 100px; }

#IE7 select, #IE7 input.text, #IE7 input.file { height: 20px; width: 490px; line-height: 20px; }

/* Checkboxes and radio buttons */
form .optionset { list-style: none; margin-left: 0; }

.checkboxset { padding-left: 0; }

.checkboxset input.checkbox { min-height: 9px; float: left; margin-right: 5px; }

.checkboxset label.required { float: left; margin-top: 5px; margin-left: -20px; }

/*	Date styles	*/
div.date input { margin-right: 5px; }

.ui-datepicker { width: 15em !important; max-width: 50% !important; }

.ui-widget { font-size: 12px !important; line-height: 12px !important; }

/* Submit button styling */
.Actions:before, .Actions:after { content: " "; display: table; }

.Actions:after { clear: both; }

.Actions .action { padding-left: 15px; padding-right: 15px; margin: 0 7.5px 7.5px 0; }

.Actions #MemberLoginForm_LoginForm_action_dologin { float: left; }

.Actions #ForgotPassword { line-height: 2em; font-size: 0.9em; }

.Actions #ForgotPassword a { padding-left: 30px; }

.Actions.step-buttons { padding: 15px 0; }

/* Multi-page form Progress */
.userform-progress { position: relative; }

.userform-progress .progress-title { position: absolute; top: -36px; }

.typography .userform-progress p { text-align: right; margin-bottom: 0; }

.userform-progress div.progress { margin-bottom: 0; height: 12px; }

.userform-progress div.progress-bar { height: 12px; min-width: 1%; max-width: 99%; }

.userform-progress .step-button-jump { background: none; border: none; }

/* Userform fieldgroup styles */
.userformsgroup > legend { margin-left: 8px; }

.userformsgroup > legend + .control-group { margin-top: 0; }

legend.left { font-size: 1em; }

input, select, textarea { border: 1px solid #002f6c; }

input[type=text] { padding-right: 5px; padding-left: 5px; }

.userform-progress ul.step-buttons, .userform-progress p { margin-top: 2px; margin-bottom: 2px; }

.userform-progress div.progress-bar { background: #002f6c; }

form, .userform { max-width: 550px; }

form div.field, .userform div.field { margin-bottom: 30px; }

form ul.optionset, .userform ul.optionset { margin-top: 0; margin-bottom: 0; }

form ul.optionset li, .userform ul.optionset li { margin-top: 7px; margin-bottom: 7px; }

form ul.optionset li:last-child, .userform ul.optionset li:last-child { margin-bottom: 10px; }

form .btn-default, .userform .btn-default { font-family: "adobe-jenson-pro", serif; margin-top: 20px; padding: 10px 40px; float: right; border: 1px solid #f3ea5d; background-color: #f3ea5d; background-image: none; color: #002f6c; font-size: 26px; text-shadow: none; }

.checkboxset { margin-bottom: 30px; }

.checkboxset .middleColumn > * { padding: 15px; background-color: #002f6c; color: #fff; margin-bottom: 5px; }

/******************************************************************************
* Futurum Magazine/Revelations Pages
******************************************************************************/
.form-container { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; }

#Form_SearchArchiveForm [type="submit"], #Form_SearchRevelationsForm [type="submit"] { display: none; }

.archive-ddown { width: 250px; margin: 30px auto; }

.archive-ddown label { display: none; }

.magazines { display: inline-block; margin: 15px 0; }

.magazine-container { width: 100%; margin: 15px 0; float: left; }

.magazine-container .magazine-edition { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -ms-flex-line-pack: center; align-content: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 20px; background-color: rgba(188, 184, 227, 0.15); width: 95%; }

.magazine-message { width: 100%; background-color: rgba(188, 184, 227, 0.15); color: #021938; }

.magazine-message h3 { padding: 30px; }

.blog-heading, .blog-content { margin: 50px 0; }

/******************************************************************************
* Calendar
******************************************************************************/
.event-group-heading { margin-top: 35px; }

.event-blurb .element { margin-top: 0; }

.event-blurb .element p { margin: 30px 0; color: #021938; }

/******************************************************************************
* Footer
******************************************************************************/
footer { padding-bottom: 60px; background: #ffffff; }

footer a:link, footer a:visited, footer a:focus, footer a:hover, footer a:active { color: #4a90e2; }

footer .social-connect p { margin-bottom: 0; }

footer .social-connect p a { display: inline-block; margin: 20px 10px; color: #fff; }

footer .logo-bar a { display: block; margin: 20px 20px 0; }

footer .logo-bar .feature { height: 100px; }

footer .logo-bar .feature img { height: 100px; }

footer .footer-links { font-size: 11px; font-weight: bold; text-align: center; }

footer .divider { border-top: 3px solid #002f6c; opacity: 0.5; }

/******************************************************************************
* Breakpoints
******************************************************************************/
/* all screens larger than extra-small (480px) */
/* screens larget than small (768px) */
@media (min-width: 768px) { /****************************************************************************** Header */
  header .header-banner img { display: initial; height: 100vh; }
  header .header-content h1 { font-size: 47px; }
  header .header-content h2 { font-size: 20px; }
  header .header-content .add-line::before { display: block; position: absolute; top: 50%; width: 100%; height: 1px; background-image: url("../images/line.png"); content: ''; z-index: -1; }
  header .header-content a { padding: 10px 40px; font-size: 24px; }
  #open-menu, #close-menu { width: auto; }
  #open-menu .hamburgers, #close-menu .hamburgers { margin-top: 50px; }
  #my-stpauls { margin-top: 30px; }
  #my-stpauls a { display: block; width: 200px; height: 61px; background-image: url("../images/my-stpaulsLogoLarge.svg"); background-repeat: no-repeat; background-position: 50% 0; background-size: contain; text-indent: -90000em; overflow: hidden; }
  .mobile-my-st-pauls { display: none; }
  .contact-bar .phone-container { padding-right: 50px; }
  .contact-bar .search-container { padding-left: 50px; }
  .contact-bar .search-container .search-bar input { width: 10em; }
  /****************************************************************************** Navigation */
  .nav-container::before { opacity: 0.7; }
  .mobile-menu { margin-top: 70px; }
  .mobile-menu h1 span, .mobile-menu h2 span, .mobile-menu h3 span, .menu-list h1 span, .menu-list h2 span, .menu-list h3 span { margin-right: 200px; }
  .mobile-search-bar { width: 50%; margin: 300px auto 0; }
  .phone-link a, .phone-link a:link, .phone-link a:focus, .phone-link a:visited { font-size: 18px; }
  .nav-column.right { padding-right: 50px; }
  /****************************************************************************** Breadcrumbs */
  .breadcrumbs { height: 72px; line-height: 72px; }
  .breadcrumbs a, .breadcrumbs span { font-size: 22px; }
  /****************************************************************************** Element Styling */
  .element { margin-top: 70px; }
  .element hr { margin: 45px 0; }
  .element blockquote { padding: 50px 80px; }
  .element blockquote::before { top: 50px; }
  /****************************************************************************** Side Content */
  .aside-link-container { padding: 0 65px; }
  .aside-link-container .aside-link { height: 160px; margin: 20px auto; }
  .aside-document-container { margin: 55px auto 70px; }
  .aside-document { width: 335px; height: 70px; margin: 16px auto; }
  .aside-document .document-icon { width: 20%; }
  .aside-document img { width: 35px; }
  .aside-document .document-title { width: 80%; }
  /****************************************************************************** Forms */
  form, .userform { max-width: 650px; }
  label.left, legend.left { width: 25%; float: left; }
  .middleColumn { width: 74%; float: right; }
  /****************************************************************************** Calendar */
  .event-details { padding-left: 50px; }
  /****************************************************************************** Footer */
  footer .footer-links { font-size: 13px; }
  footer .footer-links div:first-child { float: left; text-align: left; }
  footer .footer-links div:last-child { float: right; text-align: right; } }

/* screens larger than medium (992px) */
@media (min-width: 992px) { .mobile-menu { display: none; }
  #open-menu { width: 120px; }
  .standard-menu { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; }
  .standard-menu .menu-list { -ms-flex-preferred-size: 25%; flex-basis: 25%; }
  .standard-menu .menu-list a { font-size: 20px; margin-top: 0px; }
  .mobile-search-bar { display: none; }
  .search-bar { display: block; width: 50%; }
  /****************************************************************************** Side Content */
  .aside-link-container { width: 33%; padding: 0 10px; float: left; }
  .aside-link-container .aside-link { margin: auto; }
  .aside-document-container { width: 100%; }
  .aside-document-container .disable-document-wrapper { width: 50%; margin-bottom: 70px; float: left; }
  .aside-document-container .disable-document-wrapper:nth-child(1) .aside-document { margin-right: 15px; float: right; }
  .aside-document-container .disable-document-wrapper:nth-child(2) .aside-document { margin-left: 15px; float: left; }
  .aside-document { width: 100%; }
  .aside-document .document-title { padding-left: 5px; padding-right: 5px; }
  /****************************************************************************** Futurum Magazine Page */
  .magazines { margin: 70px 0; }
  .magazine-container { width: 33%; }
  .blog-heading, .blog-content { margin: 70px 0; } }

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { /****************************************************************************** Side Content */
  .aside-link-container { width: 100%; padding: 0; }
  .aside-link-container .aside-link { height: 200px; margin: 15px auto; }
  .aside-link-container .aside-link span { font-size: 62px; }
  .aside-document-container .document-wrapper { width: 100%; margin-bottom: 0; }
  .aside-document-container .document-wrapper:nth-child(1) { margin-top: 0; }
  .aside-document-container .document-wrapper:nth-child(1) .aside-document { margin-right: auto; float: none; }
  .aside-document-container .document-wrapper:nth-child(2) .aside-document { margin-left: auto; float: none; }
  .aside-document { width: 100%; }
  .aside-document .document-title { font-size: 22px; }
  .google-map-container { height: 420px; margin: 70px auto; }
  /****************************************************************************** Calendar */
  .event-details { padding-left: 70px; } }
/*# sourceMappingURL=main.css.map */

