/* Globals */

html, body { height:100%; }

body {
  line-height:1.25em;
  position:relative;
}
#body .btn.btn-primary,
.modal .btn.btn-primary { color: white; }

.comment h1, .comment h2, .comment h3, .comment h4, .comment h5, .comment h6 {
  line-height:1em;
  margin:0.5em 0 0.25em 0;
}

.comment h1 { font-size:1.5em; }
.comment h2 { font-size:1.15em; }
.comment h3 { font-size:1em; text-transform:uppercase; }
.comment h4 { font-size:0.8em; text-transform:uppercase; font-weight:bold; }
.comment h5 { font-size:0.8em; text-transform:uppercase; font-weight:bold; }
.comment h6 { font-size:0.8em; text-transform:uppercase; font-weight:bold; }

h1.top, h2.top, h3.top, h4.top, h5.top, h6.top { margin-top: 0; }

fieldset { border: none; margin-top: 0.5em; }
legend { font-size: 0.8em; text-transform:uppercase; font-weight:bold; padding: 0; margin: 0 0 0 -0.625em; } /* like H6 */



/* Layout */

#header-wrap,
#body-wrap,
#footer-wrap,
.ribbon-wrap {
  position:relative;
  background-image:url(../images/shadow.png);
  background-repeat:repeat-y;
  background-position:center top
}

.ribbon-wrap-bottom { padding-bottom: 1px; }

.ribbon-lower {
  height:31px;
  background-repeat:repeat-y;
  background-position:center top;
}
.ribbon-lower-top { background-image:url(../images/ribbon_shadow_top.png); }
.ribbon-lower-bottom { background-image:url(../images/ribbon_shadow_bottom.png); }

.ribbon {
  width:100%;
  position:relative;
}

.ribbon-wrap .container {
  margin-top:-31px;
}

#body {
  background:white;
  padding:18px 32px;
  width:auto;
  overflow:hidden;
  position: relative;
}

#footer-wrap { height: 150px; }
#footer {
  font-size:0.9em;
  width: 50%;
  float: left;
}
#social_links {
  width: 50%;
  float: right;
  text-align: right;
}
.footer-padding { padding:12px; }
#social_links a.-unite-social-link { margin-left: 0.3em; }
#social_links a.-unite-social-link:hover { text-decoration: none; }
#social_links a.-unite-social-link i { font-size: 2em; }

#header {
  width:100%;
}
#header.banner {
  height: 144px;
}



/* Heading */

#church_name {
  max-width:660px;
  overflow:hidden;
  line-height:1em;

  /* font-family is set by default.theme */
  font-style: normal;
  font-weight: normal;
  font-size: 4.5em;
  text-decoration: none;
  /* color is set by default.theme */
  background: transparent;
  margin: 0;
  padding: 0.25em 0.5em;
  border: none;
}

#page_title {
  display: inline-block;
  margin-bottom: 0;
  line-height: 1em;
}

ul.-unite-page-admin {
  font-size: 0.93em;
  line-height: 1.5em;
  vertical-align: bottom;
  z-index: 6;
}



body .row-fluid [class*="span"] {
  display: inline-block;
}


/* Navigation */

ol#navigation {
  list-style:none;
  margin:0;
  padding:0;
  width:100%;
  white-space:nowrap;
}

ol#navigation li {
  display:block;
}

li.menuItem {
  line-height:31px;
}

li.menuItem a {
  display:block;
  padding:0 9px;
  height:31px;
  color:white;
  text-decoration:none;
  text-transform:uppercase;
}

li.menuItem span.menu-item-current {
  display:block;
  padding:0 9px;
  height:31px;
  line-height:30px;
  color:white;
  text-transform:uppercase;
}

li.menuItem.hasSubMenu {
  padding:0 9px;
}
li.menuItem.hasSubMenu span {
  color:white;
  text-transform:uppercase;
}

.subMenu {
  display:none;
  position:absolute;
  z-index:95;
  margin:0 0 0 -10px;
  padding:0.4em 0 0.6em;
  background:#222;
}

input#search {
  font-size:1em;
  line-height:1em;
  background:transparent;
  border: 1px solid white;
  padding:0.25em 0 0.25em 0.5em;
  -webkit-appearance:none;
  margin: 0.66em 0;
}

.navbar { margin-bottom: 0; }
.navbar-inner { background:none; border:0; box-shadow:none; min-height:31px }
.dropdown-toggle:hover .dropdown-menu { display: block; }
.menuItem .dropdown-menu {
  left:auto;
  border:0;
  -webkit-box-shadow:none;
  box-shadow: none;
  background:none;
  border-radius: 0;
  -webkit-border-radius:0;
  margin-top: 0;
}
.navbar-no-pad { padding-top:0px!important; padding-bottom:0px!important; text-shadow:none!important; }
.btn-navbar { font-weight:bold; font-size:18px; }
.navbar .nav > li > a { color:#fff; }
.navbar .nav > li.open > a { color:#fff; }
.navbar .nav > li { padding:0 0 0 3px; }
.navbar .btn-navbar:hover, .navbar .btn-navbar:active, .navbar .btn-navbar { color: #828282; margin-bottom:5px; cursor: pointer; }
.menuItem .dropdown-menu { top:95%; }


/* Groups */

html.-unite-group .flash-container,
html.-unite-profile .flash-container,
html.-unite-event .flash-container { width: 70%; }

.select-all-members,
.deselect-all-members { font-size: 14px; }

.group-widget.group-widget-large .group-widget-leaders h6 {
  line-height: 22.61px;
}



/* Comments */



/* RSS */

a.rss-link {
  position: absolute;
  top: 20px;
  right: 40px;
  width: 28px;
  height: 28px;
  background: url('../images/feed-icon-28x28.png');
  text-indent: -9999em;
}



/* Page Navigation */


#page_sidebar {
  position:relative;
  right:-32px;
  margin-bottom:-74px;
  padding-bottom: 50px;
  z-index: 5;

}

#page_main, .page-description { width:85%; }

#page_sidebar .button_to { margin:18px 1em; }

.tabs > li {
  margin: 0;
  padding: 1em;
  border-bottom-width: 1px;
  border-bottom-style: solid;
}
.tabs > li:last-child { border-bottom: none; }


.tab-name a {
  color:black !important;
  text-decoration:none;
}

.tab { cursor:pointer; }

.tab:hover { background-color: rgba(255, 255, 255, 0.5); }
.tab.selected, .tab.selected:hover { background-color: white; }


.post-info { font-size: 0.9em; }
.post-author, .post-comments-count { font-weight: bold; }


/* new nav */
#navigation .sub-menu {
  visibility: hidden;
}

#navigation .current-sub-menu {
  display: block;
  width: 100%;
  position: absolute;
  top: 45px;
  z-index: 100;
}

#navigation #menu .menu-item, #navigation #menu .menu-item-category {
  float: left;
  height: 40px;
  text-align: center;
}

#navigation #menu .menu-item > .menu-item-wrapper {
  height: 100%;
  line-height: 40px;
  color: white;
  display: block;
  text-align: center;
  font-size: 18px;
  font-weight: lighter;
}
#navigation #menu .menu-item > span a,
#navigation #menu .menu-item.current-list > span,
#navigation #menu .menu-item > span.menu-item-category {
  color: #424242;
  display: block;
  padding: 0 15px;
}
#navigation #menu .menu-item.current-list > span,
#navigation #menu .menu-item > span.current {
  color: #424242;
}
#navigation #menu .menu-item > span.menu-item-current {
  padding-top: 8px;
  padding-bottom: 7px;
  margin-top: -8px;
}

#navigation #menu .menu-item > span.menu-item-category:hover,
#navigation #menu .menu-item > span > a:hover {
  padding-top: 8px;
  padding-bottom: 6px;
  margin-top: -8px;
}

#navigation #menu .menu-item > span.menu-item-category:hover {
  cursor: pointer;
}

#navigation .sub-menu .sub-menu-items > span a {
  line-height:34px;
}

#navigation #menu > .menu-item a:hover {
  text-decoration: none;
}

#navigation #menu .sub-menu .sub-menu-items a:hover,
#navigation #menu .sub-menu .sub-menu-items .menu-item-current {
  color: #424242;
  text-decoration: underline;
}

#navigation #menu .sub-menu-items > .menuItem {
  display:block!important;
}

#navigation li:hover .sub-menu { z-index: 1000 !important; }

.navbar .nav > li > .dropdown-menu:before, .navbar .nav > li > .dropdown-menu:after {
  border:0;
  display:none;
}

ol#navigation li {
    cursor: pointer;
}

.search-mobile {
  display:none;
}


@media (max-width: 768px) {
  #header .span4 {
   width:45%;
   float:right;
  }

  #header .span8 {
   width:55%;
   float:left;
  }

  #header h1 {
    font-size: 3em;
  }



  #subitems_nav li {
    line-height:18px;
  }
  #navigation #menu .menu-item > span.menu-item-current {
    background:none;
  }
  #subitems_nav.has-subitems {
    width:100%;
  }
  #subitems_nav > div {
    min-height: 100%;
    text-align: center;
  }
  #body.page-has-subitems {
    width:100%;
    border-top: 1px solid #dbdbdb;
    border-bottom:1px solid #dbdbdb;
    border-left:0;
    border-right:0;
  }
  .fc-header td {
    display:block;
  }
  #page_sidebar {
    background-color:transparent;
    top:0;
    right:0;
  }
  #page_sidebar {
    padding:0;
  }
  .-unite-page-title {
    font-size:70%;
  }
  .profile-tabs {
    margin-right:0px;
  }
  .search-mobile {
    font-size:28px;
    display:block;
    padding:0px 0px 20px 20px;
  }
  #secondary_navigation .search-mobile a {
    text-decoration: none;
  }

  body {
    overflow-x:hidden;
  }


  #secondary_navigation { text-align:right; margin-bottom:.8em; margin-left:2.25em; }
  #feedback { display:none; }
  .comment-editor *[name="comment[content]"] {
    width:100%;
  }
  input[type="text"] {
    width:100%;
  }
  .event-information .event-actions {
    position:inherit;
    text-align: left;
    border-top:1px solid #d4d4d4;
    margin-top:15px;
    padding-top:15px;
  }
  #secondary_navigation input { width: 0%; }
  .search { display:none; }

  #page_main {
    width: 100%;
  }

}

@media (max-width: 979px) {
  body {
    padding-left: 0;
    padding-right: 0;
  }

  body #body-wrap,
  body #header-wrap,
  body #footer-wrap,
  body .ribbon-wrap,
  body .ribbon-lower-top,
  body .ribbon-lower-bottom {
    background-image: none;
    overflow-x: hidden;
  }
  body #body-wrap .container,
  body #header-wrap .container,
  body #footer-wrap .container {
    width: auto;
    padding-right: 2%;
    padding-left: 2%;
  }

  ol#navigation li {
    display:block;
    line-height:32px;
  }
  #navigation #menu {
    width:100%;
  }
  #navigation #menu .menu-item {
    width:100%;
    float:none;
    height:auto;
  }
  #navigation .sub-menu .sub-menu-items {
    float:none;
  }
  .dropdown-menu, .sub-menu {
    float:none;
  }
  #navigation #menu .menu-item > span.menu-item-category:hover, #navigation #menu .menu-item > span > a:hover {
    padding:0;
    margin:0;
  }
  #navigation .sub-menu .sub-menu-items > span a {
    padding: 5px 30px;
  }

  #navigation li.menuItem .sub-menu span.menu-item-current {
    padding:0 30px;
  }

  #navigation li:hover .sub-menu {
    padding:0;
  }
  #navigation .sub-menu, #navigation li:hover .sub-menu {
    width:100%;
    position: inherit;
    margin:0;
    font-size:15px;
  }
  .menu-item-category:after {
    content:" ";
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    display:inline-block;
    margin-left: 5px;
    margin-bottom: 3px;
  }

  .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width:auto;
  }
  .nav-collapse .open > .dropdown-menu {
    visibility: visible!important;
  }
  .navbar .nav > li { float:none; }
  .nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a { font-weight: normal; padding:9px 10px; color:rgb(255, 255, 255);}
  .nav-collapse .open > .dropdown-menu { visibility: visible!important; }
  .navbar .nav > li > a:focus { color:#fff; }

  #page_main.page-tab-content { width: 100%; }
  #body .icon-menu { right: 30px; }

  #calendar_controls #event_scope { font-size: 1.5em; }
}

@media (min-width: 979px) {

  ol#navigation { height: 31px; }

  #navigation li:hover .sub-menu {
    visibility:visible;
    display: block;
    position: absolute;
    padding:0.4em 0 0.6em;
    z-index: 100;
    background:#222;
  }

  #navigation a.menu-item {
    color: #fff;
  }

  .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container {
    width:910px;
  }

  #page_main { width: 75%; }

  .page-description { width: 100%; }

}

.header-image {
  height:144px;
  width:944px;
}


/* ====== Responsive Layout Cells */
/* ============================== */

@media (max-width: 768px) {
  #calendar_controls #event_scope { font-size: 1.2em; }
}





/* Hide the checkbox. It's only needed to use the :checked pseudo-class
     when labels are clicked. */
.nav-checkbox {
  display: none;
}

/* A little CSS-only hamburger icon */
.icon-menu {
  position: absolute;
  right: 0;
  top: 25px;
  width: 1.625em;
  height: .313em;
  background: black;
  transition: right 0.3s ease;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  color: #000;
  font-size: 24px;
  background: white;
  display: none;
 }

.icon-menu::before { content: "\f0c9"; }

#nav-checkbox { display:none; }

/* off canvas side bar */
@media (max-width: 979px) {
  .icon-menu {
    display: block;
    z-index: 900;
  }

  /* Cover the whole page with this */
  .body-trigger {
    position: absolute;
    top: 0;
    right: 14em;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 999;
  }

  /* The actual off-canvas element */
  #page_sidebar {
    position: absolute;
    right: -17.5em;
    width: 17.95em;
    transition: right 0.3s ease;
    z-index: 900;
    float: none;
    top: 120px;
    border-top: 1px solid #eee;
  }

  /* Where all your main content (everything but the off-canvas) goes */
  #page_main {
    position: relative;
    left: 0;
    transition: left .3s ease;
  }

  #nav-checkbox {
    display: none;
  }
  #nav-checkbox:checked ~ .page-with-internal-nav #page_sidebar {
    right: 2%;
  }
  #nav-checkbox:checked ~ .icon-menu {
    background: white;
  }
  #nav-checkbox:checked ~ .icon-menu::before { content: "\f054"; }
  #nav-checkbox:checked ~ .body-trigger {
    pointer-events: auto;
  }
  #nav-checkbox:checked ~ .page-with-internal-nav #page_main {
    left: -30%;
    opacity:.25;
  }

  .tabs > li { padding: 0.5em; }

  .comment-replies {
    margin:1em 0 0 5px;
    border-left:3px solid #dadada;
    padding-left:10px;
  }
  .comment-byline {
    margin-left:5px;
  }

  .profile-contact-information {
    margin-left:0;
  }
}

@media screen and (max-width: 640px) {
  #calendar_controls { height: auto; }
  #calendar_controls > span,
  #calendar_controls > div {
    display: block;
    margin-bottom: 15px;
    width: 100%;
  }
  #calendar_controls #event_scope {
    margin-left: 0;
  }
  #calendar_controls .calendar-modifiers {
    float: none;
  }
  .list-view {
    padding: 2em 0;
    font-size: .8em;
  }
}
