@import url(https://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700);
@import url(/cms/core/lib/font-awesome/css/font-awesome.min.css);

/* ============================== bootstrap overridesand additional resets ============================= */
body { color: #646464; font-size: 15px; font-family: 'Open Sans', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
h1 { font-weight: bold; font-style: italic; font-size: 34px; }
h2 { font-size: 26px; }
h3 { font-weight: bold; font-size: 18px; }
h4, h5, h6 { font-weight: bold; font-size: 16px; }
a { color: #7ca76f; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #154680; }
hr { border-color: #c8c8c8; }
img { max-width: 100%; height: auto; }
iframe, object, embed { max-width: 100%; }
.btn-primary { padding: 10px 15px; border: none; border-radius: 0; background-color: #7ca76f; color: #fff; text-transform: uppercase; font-weight: bold; font-size: 14px; }
.btn-primary:hover { background-color: #154680; color: #fff; text-decoration: none; }

.btn-info { padding: 10px 15px; border: none; border-radius: 0; background-color: #154680; color: #fff; text-transform: none; font-weight: normal; font-size: 14px; }
.btn-info:hover { background-color: #7ca76f; color: #fff; text-decoration: none; }

.navbar { margin-bottom: 0; }
.navbar-static-top { border-bottom: none; }
.navbar-collapse { max-height: none; border-top: none; box-shadow: none; }
.navbar-toggle { margin: 6px 15px; padding: 9px 0; border: none; float: none; }
.navbar-toggle .icon-bar { background-color: #fff; height: 3px; }
.navbar-nav > li > a { color: #fff; font-size: 13px; }
.navbar-nav > li > a:hover, .navbar-nav > li > a:focus, .navbar-nav > li.active > a { background: #dae8eb; color: #15447e; text-decoration: none; }
@media (min-width: 576px) {
    .navbar-toggle { float: right; }
}
@media (min-width: 992px) {
    .navbar-nav { float: right; }
    .navbar-nav > li { background: url(/cms/themes/cyber-technical/images/nav-fade.png) no-repeat left top; }
    .navbar-nav > li > a { padding: 15px 21px 15px 20px; text-transform: uppercase; }
    /*.navbar-nav > li:last-child > a { padding-right: 0; }*/
    .navbar-nav > li:first-child { background: none; }
    .navbar-nav > li > a:hover, .navbar-nav > li > a:focus { background: none; color: #cecece; }
    /*.navbar-nav > li:last-child > a:hover, .navbar-nav > li:last-child > a:focus { padding-right: 21px; }*/
    .navbar-nav > li.active > a:hover, .navbar-nav > li.active > a:focus { background:#dae8eb; color: #000; }
}
@media (min-width: 1200px) {
    .navbar-nav > li > a { font-size: 14px; }
}

.breadcrumbs-bg { padding: 10px 0; margin-bottom: 20px; background: #d8e5ea; }
.breadcrumb { padding: 0; margin-bottom: 0; background: none; color: #154680; font-size: 12px; }
.breadcrumb a { color: #154680; font-style: italic; }
.breadcrumb > li + li:before { padding: 0 5px 0 3px; color: #154680; content: "/"; }

.logout-wrap { padding-top: 5px; color: #154680; font-size: 12px; }
.logout-wrap a { color: #154680; font-style: italic; }
@media (min-width: 768px) {
    .logout-wrap { padding-top: 0; text-align: right; }
}

/* use of span ensures that these classes are only applied to RadioButtonList or CheckBoxList controls because they wrap the labels and inputs in a span, rather than a div wrap used by bootstrap */
span.radio input[type="radio"], span.checkbox input[type="checkbox"] { margin-left: 0; }
span.radio, span.checkbox { margin-top: 0; }
.form-group textarea { min-height: 7em; } /* this property is in lieu of the ability to set rows attribute in forms module, 1em is equivalent to the current font size */
span.radio.rbl-inline > label { margin-right: 10px; padding-left: 18px; } /* this is a useful extension class form fields such as donation amount on the donation form */

.nav-tabs { margin-bottom: 20px; }

/* ============================== formatting ============================= */
@media (min-width: 992px) {
    .align-center-md { text-align: center; }
    .align-right-md { text-align: right; }
}

p.lead { font-size: 18px; }
a.button-green { display: inline-block; padding: 10px 15px; background: #7ca76f; color: #fff; text-transform: uppercase; font-weight: bold; font-size: 14px; }
a.button-green:hover { background-color: #154680; color: #fff; text-decoration: none; }

.data-table { border-collapse: collapse; }
.data-table th, .data-table td { padding-right: 15px; }

/* ============================== page ============================= */
#page-header { background: #154680; color: #fff; }
.page-header-logo { display: block; position: absolute; top: 0; z-index: 1001; }
.page-header-logo img { padding: 15px 0 10px; max-width: 120px; }
.page-header-contact-info { padding: 15px 0 0; text-transform: uppercase; font-size: 16px; text-align: right; }
.page-header-contact-info .phone-numbers { display: block; color: #90e7fa; font-weight: bold; }
.page-header-contact-info .phone-numbers a { color: #90e7fa; }
.page-header-contact-info .phone-numbers span { display: block; }
.page-header-contact-info .social { display: block; padding-top: 4px; }
.page-header-contact-info .social img { padding: 0 0 5px 5px; }

/*@media (min-width: 768px) {*/
@media (min-width: 576px) {
    .page-header-logo img { padding: 15px 0 10px; max-width: 160px; }
    .page-header-contact-info .phone-numbers span { display: inline; }
    .page-header-contact-info .phone-numbers span + span:before { padding: 0 5px; color: #90e7fa; content: "|"; }
    .page-header-contact-info .social { padding-top: 0; }
}
@media (min-width: 992px) {
    .page-header-contact-info { padding: 15px 0 20px 20px; }
    .page-header-contact-info .phone-numbers { display: inline; padding-right: 5px; }
    .page-header-contact-info .social { display: inline; }
}
@media (min-width: 1200px) {
    .page-header-logo img { padding: 22px 0; max-width: 200px; }
}

.page-footer { padding-bottom: 20px; text-align: center; font-size: 14px; }

/* home */
.banner-bg-envision { padding: 20px 0; text-align: center; color: #ffffff; background-color: #000000; background-image: url(/media/images/dots.jpeg); background-repeat: no-repeat; background-position: center bottom; background-size: contain; }
.banner-bg-envision-blurb { margin: 0 auto; width: 98%; padding: 15px 20px; background-color: rgba(112, 121, 125, 0.9); }
.banner-bg-envision h1 { font-style: normal; font-size: 20px; margin-bottom: 30px; }
.banner-bg-envision p { margin-bottom: 20px; }
.banner-bg-envision p a  { color: #ec7409; text-decoration: underline; }
@media (min-width: 576px) {
    .banner-bg-envision { padding: 50px 0 70px; }
    .banner-bg-envision h1 { font-style: normal; font-size: 30px; margin-bottom: 30px; }
    .banner-bg-envision-blurb { margin: 0 auto; width: 70%; padding: 20px 30px; background-color: rgba(112, 121, 125, 0.9); }
}

.banner-bg { background: #cee8ee; text-align: center; }
.banner-bg img { margin: 0 auto; }
.home-content { margin-top: 20px; }
.home-content h1 { font-weight: normal; font-style: normal; }
.home-sidebar { padding-top: 20px; min-height: 200px; font-size: 15px; }
.home-sidebar a { color: #154680; }
.home-sidebar-bg { padding: 25px; background: #f0f0f0; }
.home-sidebar-bg > h2 { margin-top: 0; }
.client-spotlight h2 { font-size: 30px; }
.client-spotlight img { border: solid 1px #dbdbdb; margin-top: 10px; }
.client-spotlight h3 { margin-top: 10px; font-weight: normal; font-size: 14px; }
@media (min-width: 992px) {
    .client-spotlight .row { margin-left: -40px; margin-right: -40px; }
    .client-spotlight [class*='col-'] { padding-left: 40px; padding-right: 40px; }
}
/*@media (min-width: 768px) {
    .container-alt { padding-left: 40px; padding-right: 40px; width: 750px; }
    .container-alt .row { margin-left: -40px; margin-right: -40px; }
    .container-alt [class*='col-'] { padding-left: 40px; padding-right: 40px; }
}
@media (min-width: 992px) {
    .container-alt { width: 970px; }
}
@media (min-width: 1200px) {
    .container-alt { width: 1170px; }
}*/

/* sub pages */
.sidebar { padding-top: 20px; padding-bottom: 20px; }
.sidebar-bg { padding: 15px 20px; background-color: #d8e5ea; color: #154680; }
.sidebar-bg h3 { font-style: italic; }

.side-nav { margin-bottom: 20px; padding: 0; list-style-type: none; font-weight: bold; font-size: 18px; }
.side-nav ul { margin-bottom: 0; list-style-type: none; }
.side-nav li { }
.side-nav li a { display: block; padding: 4px 0; color: #154680; }
.side-nav li a:before { padding: 0 8px 0 0; color: #7fa868; content: "\f0da"; font-family: 'FontAwesome'; }
.side-nav li a:hover, .side-nav li.active a { text-decoration: none; }
.side-nav li a:hover:before, .side-nav li.active a:before { color: #154680; }

/* feature focus */
.feature-focus { margin-top: 20px; margin-bottom: 20px; padding: 20px; background: #d8e5ea; color: #154580; font-size: 14px; }
.row.feature-focus { margin-right: 0; margin-left: 0; padding: 20px 5px; }
.feature-focus .col-md-3, .feature-focus .col-md-9 { padding-right: 10px; padding-left: 10px; }
.feature-focus h3 { margin-top: 0; color: #75a475; }

/* portfolio */
/*#portfolio-menu { margin: 20px 0; padding: 15px 0; border-top: solid 1px #c8c8c8; border-bottom: solid 1px #c8c8c8; font-size: 14px; }
#portfolio-menu a { color: #154680; }
#portfolio-menu .nav > li > a:hover, #portfolio-menu .nav > li > a:focus, #portfolio-menu .nav li.active > a { background: #7ca76f; color: #fff; }
#portfolio-menu .nav-pills li { float: none; text-align: center; }
#portfolio-menu .nav-pills > li + li { margin-left: 0; }
#portfolio-menu .nav-pills li a { border-radius: 0; }
@media (min-width: 992px) {
    #portfolio-menu .nav-pills li { float: left; }
    #portfolio-menu .nav-pills > li + li { margin-left: 20px; }
}
@media (min-width: 1200px) {
    #portfolio-menu .nav-pills > li + li { margin-left: 60px; }
}*/

/* portfolio */
#portfolio-menu { margin: 20px 0; padding: 0; border-top: solid 1px #c8c8c8; font-size: 14px; }
#portfolio-menu ul { margin: 0; padding: 0; list-style: none; }
#portfolio-menu li { display: block; border-bottom: solid 1px #c8c8c8; }
#portfolio-menu a { display: inline-block; color: #154680; padding: 10px 0; text-decoration: none; }
#portfolio-menu a:hover, #portfolio-menu a:focus, #portfolio-menu li.active a { color: #7ca76f; }
@media (min-width: 992px) {
    #portfolio-menu { border-bottom: solid 1px #c8c8c8; }
    #portfolio-menu li { display: inline-block; border-bottom: none; }
    #portfolio-menu li + li { margin-left: 10px; }
    #portfolio-menu a:hover, #portfolio-menu a:focus, #portfolio-menu li.active a { padding-bottom: 7px; border-bottom: solid 3px #7ca76f; }
}
@media (min-width: 1200px) {
    #portfolio-menu li + li { margin-left: 30px; }
}

.portfolio-tab { margin-top: 30px; }
.portfolio-tab ul li { margin-bottom: 30px; }
.portfolio-tab ul li h3 { margin-top: 10px; font-weight: normal; font-size: 14px; }
.portfolio-tab ul li a img { border: solid 1px #dbdbdb; }
@media (min-width: 992px) {
    .portfolio-tab .row { margin-left: -40px; margin-right: -40px; }
    .portfolio-tab [class*='col-'] { padding-left: 40px; padding-right: 40px; }
}

/* before and after */
#before-and-after { padding: 5px 20px; background: #f0f0f0; }
#before-and-after h3 { color: #154680; font-weight: normal; font-size: 22px; }
#before-and-after .item h3 { text-align: center; font-weight: bold; font-size: 18px; }
#before-and-after .carousel-controls a img { max-width: 50px; }
#before-and-after .carousel-controls { padding-top: 20px; padding-bottom: 20px; color: #154680; font-size: 17px; }