/* ==========================================================================
Author's custom styles
========================================================================== */
.navbar-toggle {
    border: none;
    background: transparent !important;
    margin-right: 0
    }
.navbar-toggle:hover {
    background: transparent !important
    }
.navbar-toggle .icon-bar {
    width: 22px;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s
    }
.navbar-toggle .top-bar {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 10% 10%;
    -moz-transform-origin: 10% 10%;
    -ms-transform-origin: 10% 10%;
    -o-transform-origin: 10% 10%;
    transform-origin: 10% 10%
    }
.navbar-toggle .middle-bar {
    opacity: 0
    }
.navbar-toggle .bottom-bar {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 10% 90%;
    -moz-transform-origin: 10% 90%;
    -ms-transform-origin: 10% 90%;
    -o-transform-origin: 10% 90%;
    transform-origin: 10% 90%
    }
.navbar-toggle.collapsed .top-bar {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0)
    }
.navbar-toggle.collapsed .middle-bar {
    opacity: 1
    }
.navbar-toggle.collapsed .bottom-bar {
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -ms-transform: rotate(0);
    -o-transform: rotate(0);
    transform: rotate(0)
    }
@media (min-width: 768px) {
    body {
        padding-bottom: 267px !important
        }
    footer#safer {
        height: 267px !important
        }
    }
html {
    position: relative;
    min-height: 100%
    }
body {
    padding-bottom: 559px
    }
footer#safer {
    background-color: #eee;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
    bottom: 0;
    position: absolute;
    height: 559px
    }
footer#safer strong {
    color: #333
    }
footer#safer .facebook-icon, footer#safer .twitter-icon {
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block;
    width: 40px;
    height: 40px
    }
footer#safer .twitter-icon {
    background-image: url(/application/themes/safer/img/twitter.png)
    }
footer#safer .twitter-icon:hover {
    background-image: url(/application/themes/safer/img/twitter-rollover.png)
    }
footer#safer .facebook-icon {
    background-image: url(/application/themes/safer/img/facebook.png)
    }
footer#safer .facebook-icon:hover {
    background-image: url(/application/themes/safer/img/facebook-rollover.png)
    }
footer#safer a {
    color: #337ab7
    }
footer#safer a:hover {
    text-decoration: none;
    color: #22527b
    }
footer#safer hr {
    margin-top: 0;
    border-color: grey
    }
footer#safer .row div p:first-child {
    margin-bottom: 5px
    }
footer#safer .form-group {
    margin-bottom: 0
    }
footer#safer .row > div {
    margin-bottom: 20px
    }
footer#safer form button {
    margin-top: 5px
    }
@media (min-width: 992px) {
    footer#safer {
        padding-top: 40px;
        padding-bottom: 40px
        }
    footer#safer .row div p:first-child {
        margin-bottom: 10px
        }
    footer#safer .form-group {
        margin-bottom: 15px
        }
    footer#safer form button {
        margin-top: 0
        }
    }
@media (min-width: 768px) {
    .nav-page #sidenav {
        width: 37%
        }
    .nav-page .main-content {
        width: 63%
        }
    }
#sidenav {
    /* First level of nav */
    /* All levels of nav */
    /* Nav: second level (shown on .active) */
    /* Show and affix the side nav when space allows it */
    }
#sidenav .bs-sidebar.affix {
    position: static
    }
@media (max-width: 768px) {
    #sidenav .bs-sidebar {
        max-height: none !important
        }
    }
#sidenav .bs-sidenav {
    margin-top: 20px;
    margin-bottom: 30px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-shadow: 0 1px 0 #fff;
    background-color: #f8f9fa;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-clip: padding-box
    }
#sidenav .bs-sidebar .nav > li > a {
    display: block;
    color: #716b7a;
    padding: 5px 20px
    }
#sidenav .bs-sidebar .nav > li > a:hover, #sidenav .bs-sidebar .nav > li > a:focus {
    text-decoration: none;
    background-color: #e4e9ec;
    border-right: 1px solid #dbd8e0
    }
#sidenav .bs-sidebar .nav > .active > a, #sidenav .bs-sidebar .nav > .active:hover > a, #sidenav .bs-sidebar .nav > .active:focus > a {
    font-weight: bold;
    color: #175676;
    background-color: transparent;
    border-right: 1px solid #563d7c
    }
#sidenav .bs-sidebar .nav .nav {
    display: block;
    /* Hide by default, but at >768px, show it */
    margin-bottom: 8px
    }
#sidenav .bs-sidebar .nav .nav > li > a {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 30px;
    font-size: 90%
    }
@media (min-width: 768px) {
    #sidenav {
        /* Widen the fixed sidebar */
        }
    #sidenav .bs-sidebar .nav .nav {
        display: none
        }
    #sidenav .bs-sidebar .nav > .active > ul {
        display: block
        }
    #sidenav .bs-sidebar.affix, #sidenav .bs-sidebar.affix-bottom {
        overflow-y: auto
        }
    #sidenav .bs-sidebar.affix {
        position: fixed;
        /* Undo the static from mobile first approach */
        width: inherit;
        padding-right: 30px;
        top: 70px
        }
    #sidenav .bs-sidebar.affix-bottom {
        position: absolute;
        /* Undo the static from mobile first approach */
        }
    #sidenav .bs-sidebar.affix-bottom .bs-sidenav, #sidenav .bs-sidebar.affix .bs-sidenav {
        margin-top: 0;
        margin-bottom: 0
        }
    }
@media (min-width: 768px) {
    html.ccm-toolbar-visible .bs-sidebar.affix {
        top: 118px !important
        }
    }
html.ccm-toolbar-visible .navbar-fixed-top {
    top: 48px
    }
body {
    padding-top: 50px
    }
h1, h2, h3 {
    font-family: "Pompiere", cursive
    }
.btn-primary {
    color: #eee;
    background-color: #b73473;
    border-color: #a32e67
    }
.btn-primary:focus, .btn-primary.focus {
    color: #eee;
    background-color: #8f295a;
    border-color: #401228
    }
.btn-primary:hover {
    color: #eee;
    background-color: #8f295a;
    border-color: #732149
    }
.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    color: #eee;
    background-color: #8f295a;
    border-color: #732149
    }
.btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus {
    color: #eee;
    background-color: #732149;
    border-color: #401228
    }
.btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary {
    background-image: none
    }
.btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus {
    background-color: #b73473;
    border-color: #a32e67
    }
.btn-primary .badge {
    color: #b73473;
    background-color: #eee
    }
/* Header and footer */
.navbar {
    margin-bottom: 0
    }
.navbar .navbar-right li {
    margin-right: 15px
    }
.navbar .navbar-btn {
    display: inline-block
    }
.navbar-default .navbar-brand {
    color: #56A7E9;
    padding: 0;
    margin-top: -5px
    }
@media screen and (min-width: 768px) {
    .navbar-default .navbar-brand {
        margin-left: 0
        }
    }
.logo {
    background-image: url("/application/themes/safer/img/SAFER bullhorn logo.png");
    background-repeat: no-repeat;
    background-size: 100%;
    display: inline-block !important;
    height: 40px;
    width: 50px;
    margin-top: 10px;
    margin-left: 4px
    }
@media screen and (min-width: 768px) {
    .logo {
        margin-left: 15px
        }
    }
.page-logo {
    max-height: 100px;
    margin-bottom: 15px
    }
@media screen and (min-width: 768px) {
    .navbar-nav {
        margin-left: 10px
        }
    }
.navbar-nav > li > a.btn {
    margin-top: 6px;
    margin-left: 5px;
    padding-top: 8px;
    padding-bottom: 8px
    }
@media screen and (max-width: 880px) {
    .navbar-nav > li > a {
        padding-left: 6px;
        padding-right: 6px
        }
    }
/* Homepage */
.jumbotron {
    margin-bottom: 0;
    color: #333;
    padding-bottom: 0
    }
@media screen and (min-width: 768px) {
    .jumbotron {
        padding-bottom: 30px !important
        }
    }
.jumbotron .big-safer {
    font-size: 100px;
    margin-right: 5px;
    text-transform: uppercase;
    color: #57a6e8;
    font-weight: bold;
    float: left;
    font-family: "Pompiere", cursive;
    padding-bottom: 30px;
    line-height: 26px
    }
@media screen and (min-width: 992px) {
    .jumbotron .big-safer {
        line-height: 66px;
        padding-bottom: 0
        }
    }
.jumbotron h1 {
    font-size: 46px;
    margin-bottom: 16px
    }
.jumbotron h1 strong {
    vertical-align: middle
    }
@media screen and (min-width: 768px) {
    .jumbotron {
        padding: 60px 0
        }
    }
.jumbo-image {
    background: url(/application/themes/safer/img/jumbotron.jpg) no-repeat center center;
    background-size: cover;
    height: 300px;
    width: 100%
    }
.main-blurbs-container {
    text-align: center
    }
.main-blurbs-container .main-sections {
    padding-top: 30px;
    display: block;
    margin-bottom: 30px;
    float: none;
    vertical-align: top;
    color: #333
    }
.main-blurbs-container .main-sections:not(:first-child) {
    border-top: 1px solid #eee
    }
.main-blurbs-container .main-sections .button-container {
    width: 100%;
    bottom: -40px;
    position: static
    }
@media (min-width: 768px) {
    .main-blurbs-container {
        margin-top: 30px;
        margin-bottom: 100px;
        display: table
        }
    .main-blurbs-container .main-sections {
        display: table-cell;
        margin-bottom: 0;
        border-top: none !important
        }
    .main-blurbs-container .main-sections .button-container {
        position: absolute;
        padding-right: 30px
        }
    }
/* Content */
.header-section {
    padding-top: 30px
    }
@media screen and (min-width: 768px) {
    .header-section {
        height: 175px;
        padding-bottom: 0
        }
    }
.header-section img {
    max-height: 140px
    }
html.ccm-toolbar-visible .main-content h1, html.ccm-toolbar-visible .main-content h2 {
    padding-top: 143px;
    margin-top: -98px
    }
html.ccm-toolbar-visible .main-content h1:first-child, html.ccm-toolbar-visible .main-content h2:first-child {
    padding-top: 118px
    }
.main-content {
    margin-bottom: 30px;
    line-height: 1.5em
    }
.main-content.full {
    margin-top: 30px
    }
.main-content.full h1 {
    font-size: 45px
    }
.main-content.full a img:hover {
    background: #eee
    }
.main-content h1, .main-content h2 {
    padding-top: 95px;
    margin-top: -50px
    }
.main-content h1:first-child, .main-content h2:first-child {
    padding-top: 70px
    }
.main-content h1 {
    font-size: 30px
    }
.main-content h2 {
    font-size: 24px
    }
.table.teach-in thead {
    text-align: center;
    color: #56A7E9;
    font-weight: 200;
    font-size: 18px
    }
.table.teach-in .blue {
    color: #56A7E9
    }
.table.teach-in .large {
    font-size: 18px;
    font-weight: 200
    }
.donate-toggle-btn {
    margin-top: 20px;
    margin-bottom: 20px
    }
.panel-default {
    margin-left: 30px;
    margin-bottom: 5px
    }
.panel-default .panel-heading:hover {
    text-decoration: underline
    }
.panel-default .panel-heading .panel-title p {
    display: inline
    }
.panel-default .panel-heading i.glyphicon {
    float: right
    }
.panel-default .panel-heading .glyphicon-chevron-up {
    display: none
    }
.panel-default .panel-heading.collapsed .glyphicon-chevron-down {
    display: none
    }
.panel-default .panel-heading.collapsed .glyphicon-chevron-up {
    display: block
    }
.donate-column {
    margin-top: 20px;
    margin-bottom: 20px
    }
.donate-column .panel {
    margin-left: 0;
    min-width: 332px
    }
.donate-column #tbzframe {
    width: 100%;
    height: 1590px
    }
@media screen and (min-width: 542px) {
    .donate-column #tbzframe {
        height: 1320px
        }
    }
@media screen and (min-width: 830px) {
    .donate-column #tbzframe {
        height: 885px
        }
    }
@media screen and (min-width: 992px) {
    .donate-column #tbzframe {
        height: 1590px
        }
    }
.error-page-container {
    background-color: #eee;
    border: 1px solid #b3b3b3;
    margin: 0 auto;
    max-width: 500px;
    padding: 10px;
    margin-top: 30px;
    margin-bottom: 30px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-clip: padding-box;
    -webkit-box-shadow: 0 1px 10px #a7a7a7;
    box-shadow: 0 1px 10px #a7a7a7
    }
.mfp-content {
    height: 100%;
    width: 100%;
    max-width: none !important;
    max-height: none !important
    }
.mfp-iframe-holder {
    padding: 40px !important
    }
.report-link {
    padding: 20px;
    display: inline-block
    }