/*
Theme Name: My Brother's Keeper
Version: 1.0
*/

@import url('bootstrap.css');
@import url('font-awesome.min.css');
@import url('jPushMenu.css');
@import url('general.css');

@font-face {
font-family: EvelethRegular;
src: url("../fonts/EvelethRegular.otf") format("opentype");
}

@font-face {
font-family: EvelethRegular;
font-weight: bold;
src: url("../fonts/EvelethRegular-Bold.otf") format("opentype");
}


/*===== Container =====*/
.container {width:980px; max-width:100%;}
.container.nopad {padding:0;}
/*===== Social Icons =====*/

ul.social-icons {list-style:none; margin:0;}
ul.social-icons li {display:inline-block; padding:8px; list-style:none; margin:0;}
social-icons a, span.symbol:hover, span.symbol:focus { text-decoration:none; border:none;}

/*===== page elements =====*/

body {font-family: Arial, sans-serif; height:100%; color:#4c505a; font-size:18px;}
#wrapper { display:block; width:100%; height:100vh;}
p {margin:0 0 25px 0;}

img {max-width:100%;}
.images img {width:100%; height: auto;}

.white_bg {background:#fff;}
.beige_bg {background:#efebe2;}
.blue_bg {background:#005c7d; color:#fff;}
.parallax {
	background-position: 50% 0;
    background-repeat:no-repeat;
    background-attachment:fixed;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size:cover;
	z-index:0;
 } 
.std_image {background-position: top center;	background-size: cover;}
.overlay_box {padding:25px; background-color:rgba(0,0,0,.5);}

h1,h2,h3,h4,h5 {font-family: EvelethRegular, open-sans;}
h1 {}
h2 {}

#tagLine {padding:0;}
#tagLine h2 {margin:0; padding:50px; color:#fff;}

.light,
.light h1,
.light h2 {color:#fff;}

.light a {color:#efebe2;}
.light a:hover {color:#fff;}

.parallax h1 {text-shadow: 5px 5px rgba(0,0,0,.5);}

.align-left {text-align:left;}
.align-center {text-align:center;}
.align-right {text-align:right;}

.push-left {float:left;}
.push-right {float:right;}

a {color:#005c7d; text-decoration:none;}
a:hover {color:#4f5460; text-decoration:none;}

blockquote {font-size:2em; font-family: 'Cabin', sans-serif;}

.btn-primary {background-color:#005c7d; /*padding:15px 30px; font-size:20px;*/}
.blue_bg .btn-primary {background-color:#fff; color:#005c7d;}

a.btn {max-width:100%; white-space: normal; margin:0 15px;}
a.btn:hover {}

.donate-btn {padding-top:25px; text-align:center;}

.donate {position:absolute; width:100%; text-align:right; top:0; right:0; padding:15px; background:url('../images/donate_bg.png') top right repeat-y;}
.donate a {color:#fff; font-size:18px; font-weight:bold; text-transform:uppercase;}

/*===== sections =====*/
section {width:100%; padding-bottom:75px;}
section.custom {padding:50px 0 25px 0;}

section h1 {text-align:center; padding:75px 0 50px; margin:0;}

/*header*/

header {
	position:fixed;
	width:100%;
	top:0; left:0;
	background:rgba(0,0,0,0);
	-webkit-transition: background 1s; /* For Safari 3.1 to 6.0 */
  	transition: background 1s;
	z-index:2;
	padding:30px 50px;
	height:200px;
}
.admin-bar header {top:32px;}
header.solid {background:rgba(0,0,0,1); height:85px; padding:10px 30px;}

header #header-logo {
    -moz-transition-property: width, height;
    -o-transition-property: width, height;
    -webkit-transition-property: width, height;
    transition-property: width, height;
    -moz-transition-duration: 0.2s, 0.2s;
    -o-transition-duration: 0.2s, 0.2s;
    -webkit-transition-duration: 0.2s, 0.2s;
    transition-duration: 0.2s, 0.2s;
    -moz-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    background-image: url('../images/mbki_logo.png?1');
    -moz-background-size: contain;
    -o-background-size: contain;
    -webkit-background-size: contain;
    background-size: contain;
    background-repeat: no-repeat;
    float: left;
    width: 212px;
    height: 155px;
    position: relative;
}

header.solid #header-logo {
    width: 89px;
    height: 65px;
}

header #header-right {
	position: absolute;
    top: 30px;
    right: 45px;
    margin-top: -8px;
	z-index:4;
}

header.solid #header-right {
	top: 15px;
}

#header-right > div {float:right;}
#header-right .menu-btn-wrap {margin-left:20px;}
#header-right .donate-btn-wrap a{ text-transform:uppercase; }

header .toggle-menu {
    -moz-transition-property: right, top;
    -o-transition-property: right, top;
    -webkit-transition-property: right, top;
    transition-property: right, top;
    -moz-transition-duration: 0.2s, 0.2s;
    -o-transition-duration: 0.2s, 0.2s;
    -webkit-transition-duration: 0.2s, 0.2s;
    transition-duration: 0.2s, 0.2s;
    -moz-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    font-family: "futura-pt", sans-serif;
    font-style: normal;
    font-weight: 700;
    color: #FFF;
    text-transform: uppercase;
    /*position: absolute;
    top: 30px;
    right: 45px;
    margin-top: -8px;
	z-index:4;*/
}
header .toggle-menu:after {
    font-family: FontAwesome;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 14px;
    content: "\f0c9";
    margin-left: 10px;
}

header.solid .toggle-menu {top:15px;}

.toggle-menu,
.header-menu-link {
    -moz-transition: left 0.2s ease, right 0.2s ease;
    -o-transition: left 0.2s ease, right 0.2s ease;
    -webkit-transition: left 0.2s ease, right 0.2s ease;
    transition: left 0.2s ease, right 0.2s ease;
    z-index: 1000
}

#main-nav button,
header button {padding:0; margin:0; background:none; border:none;}


#hero {position:relative; background-color:#000;}
#hero.standard-page {max-height:350px; overflow:hidden; background-position:bottom center; background-size:cover;}

/*navigation*/

#main-nav {}
.cbp-spmenu {
    /*background: #337ab7;*/
	background:#000;
}

/* ===== Top ===== */
nav ul {position: relative; padding:0; margin:0; list-style:none;}
nav ul li {list-style:none; }

nav .nav-header {font-size:26px; color:#fff; padding:15px; border-bottom: 1px solid #292929;}
.cbp-spmenu .nav-header button {
   	padding: 0;
	float:right;
	font-size:26px;
}
.cbp-spmenu-vertical .nav-header a {
    border-bottom: none;
	padding:0;
	border-bottom: 1px solid #292929;
}
.cbp-spmenu .nav-header a:hover {
    background: none;
}


.cbp-spmenu-vertical .nav a {border-bottom: 1px solid #292929;}

/* ===== First Level ===== */				
nav #menu-main-navigation li a {
	padding:10px 20px;
	display:block;
	text-decoration:none;
	color:#fff;
	text-transform:uppercase;
	font-size:14px;
	font-weight:400;
	position: relative;
}
nav #menu-main-navigation li:hover > a,
nav #menu-main-navigation li.active > a,
nav #menu-main-navigation li.current-menu-item > a,
nav #menu-main-navigation li.current-page-ancestor > a {color:#337ab7; background:none;}
nav #menu-main-navigation ul {
	display:none;
	position: absolute;
	top:52px;
	left: 0;
	width: 100%;
	z-index:99999999;
}

nav #menu-main-navigation ul li:hover ul {
	display:block;
}
/* ===== Second and Third Level ===== */
nav #menu-main-navigation li:hover ul {
	display: block;
}

nav #menu-main-navigation ul li {display:inline-block;  padding:0 10px;}

nav #menu-main-navigation ul li a {
	display:block;
	float:none;
	font-weight:400 !important;
	font-size:14px;
	color:#fff;
	text-transform:uppercase;
}

nav #social-nav {text-align:center;}
nav .social-icons {margin:0 auto; display:inline-block;}
nav .social-icons li {display:inline-block; float:none;}
nav .social-icons a {border:none; font-size:30px; padding:10px;}
nav .social-icons a:hover {background:none; color:#337ab7;}

nav #menu-secondary-navigation  {padding:15px; text-align:center;}
nav #menu-secondary-navigation a {border-bottom: 1px solid #292929; background:#337ab7; padding:10px; margin-bottom:15px; border:2px solid #337ab7;}
nav #menu-secondary-navigation a:hover {background:#efebe2; color:#337ab7;}

.push-menu {
    width: 320px;
    height: 100%;
    position: fixed;
    top: 0;
    background: #000;
    z-index: 10004
}
.push-menu .menu-scroll-container {
    position: relative;
    overflow: hidden
}
.push-menu .menu-wrap {
    padding: 45px 0
}
.push-menu.right {
    right: -320px
}
.open .push-menu.right {
    right: 0
}
.push-menu.left {
    left: -320px
}
.open .push-menu.left {
    left: 0
}
.push-menu .menu {
    line-height: 1
}
.push-menu #close-btn {
    -moz-transition: opacity 0.2s ease;
    -o-transition: opacity 0.2s ease;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
    position: absolute;
    top: 40px;
    right: 25px;
    color: #FFF;
    z-index: 500;
    height: 40px;
    width: 40px;
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=80);
    opacity: 0.8
}
.push-menu #close-btn:before {
    top: 12px;
    left: 12px;
    position: relative
}
.no-touch .push-menu #close-btn:hover {
    filter: progid: DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1
}
.push-menu li {
    border-left: 4px solid transparent;
    line-height: 1
}
.push-menu li a {
    -moz-transition-property: padding, opacity;
    -o-transition-property: padding, opacity;
    -webkit-transition-property: padding, opacity;
    transition-property: padding, opacity;
    -moz-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    -webkit-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -moz-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    font-family: "futura-pt", sans-serif;
    font-style: normal;
    font-weight: 300;
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=80);
    opacity: 0.8;
    display: block;
    padding: 2% 40px;
    font-size: 24px;
    color: #FFF
}
.push-menu li a:first-child {
    margin-top: 0
}
.push-menu li a:hover,
.push-menu li a:focus,
.push-menu li a:active {
    color: #FFF
}
.no-touch .push-menu li:hover {
    border-left: 4px solid #00bc96
}
.no-touch .push-menu li:hover a {
    padding-left: 45px;
    filter: progid: DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1
}
.push-menu #main-nav {
    margin-bottom: 20px
}
.push-menu #main-secondary-nav li a {
    position: relative;
    color: #07cca4
}
.push-menu #main-secondary-nav li a:hover,
.push-menu #main-secondary-nav li a:focus,
.push-menu #main-secondary-nav li a:active {
    color: #07cca4
}
.push-menu #main-secondary-nav li.shop a {
    padding-right: 30px
}
.push-menu #main-secondary-nav li.shop a:after {
    font-family: 'ic-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e604";
    position: relative;
    font-size: 18px;
    right: -10px
}
.push-menu #main-tertiary-nav {
    margin-top: 20px
}
.push-menu #main-tertiary-nav li a {
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity: 0.5;
    font-size: 18px;
    position: relative
}
.push-menu #main-tertiary-nav li.crisis-tracker a {
    padding-right: 20px
}
.push-menu #main-tertiary-nav li.crisis-tracker a:after {
    font-family: 'ic-icons';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e604";
    position: relative;
    font-size: 12px;
    right: -10px
}
.no-touch .push-menu #main-tertiary-nav li:hover a {
    filter: progid: DXImageTransform.Microsoft.Alpha(enabled=false);
    opacity: 1
}
.push-menu #main-tertiary-nav .email {
    display: inline-block;
    vertical-align: middle;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    margin-top: 30px
}
.push-menu #menu-social {
    margin-top: 30px;
    padding: 0 40px
}
.push-menu #menu-social .twitter {
    margin-top: 10px
}
.push-menu #menu-social #menu-made-for {
    font-family: "futura-pt", sans-serif;
    font-style: normal;
    font-weight: 400;
    filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=50);
    opacity: 0.5;
    font-size: 15px;
    color: #FFF;
    margin-top: 35px;
    line-height: 1.2
}
.push-menu #menu-social #menu-made-for b {
    font-family: "futura-pt", sans-serif;
    font-style: normal;
    font-weight: 700
}


.row.related-videos .col-sm-12.video {width:50%; float:none; margin:0 auto;}
.related-videos h2 {text-align:center; border-top:1px dashed #4c505a; margin-top:25px; padding-top:25px;}

.images > div {margin-bottom:15px;}
.shortcode > div {padding-bottom:10px; margin-bottom:10px; border-bottom:1px dashed #4c505a;}

.social-btn-wrap a {color:#fff; font-size:26px; margin-right:20px;}
.social-btn-wrap  ul.social-icons li {
    padding: 0;
}

.dontation-option {text-align:center; padding:20px 0; margin-bottom:20px; border-bottom:1px dashed #4c505a;}
.dontation-option:first-of-type h2 {padding-top:0; margin-top:0;}
.dontation-option:last-of-type {border-bottom:0; marin-bottom:0;}
.dontation-option table {width:100%;}
.dontation-option td {padding:8px 0;}
.dontation-option select, .dontation-option input[type="text"] {padding:5px; width:200px;}

footer {padding:15px; background:#000; color:#fff;}
footer a {color:#fff;}

.sidebar {padding:75px 0;}
.sidebar img {margin-bottom:25px;}

@media (min-width:993px) {}
@media (max-width:992px) {	
}

@media (max-width: 860px) {
}

@media (max-width: 782px) {
}

@media (max-width: 640px) {
	.parallax {
		background-attachment: scroll;
	 }
	
}

@media (max-width: 540px) {
	header {background:rgba(0,0,0,1); height:85px; padding:10px 30px;}
	header #header-logo {
		width: 89px;
		height: 65px;
	}	
	
	header #header-right {
		position: absolute;
		top: 15px;
		right: 45px;
	}
	#header-right > div {float:none; text-align:right; padding-bottom:10px;}
	.social-btn-wrap {position: fixed; right:150px; top:10px;}
	
	header.solid .toggle-menu {
		top: 10px;
	}
	
	.break-mobile {display:table; content:''; clear:both; height:0px;}
	
	.row.related-videos .col-sm-12.video {
		width: 100%;
	}
	.row.related-videos .video {margin-bottom:20px;}
	.row img {margin-bottom:20px;}
	
	.sidebar {padding:25px; text-align: center;}
	.sidebar img {width:100%; height: auto;}
}
@media (max-width: 480px) {
	.dontation-option {font-size:14px;}
}