/*
Theme Name: Friendship Church
Theme URI: http://experiencefriendship.com;
Author: Weilenman Studios Inc
Author URI: http://weilenman.com
Version: 1.0
*/

*{
  font-family:'proxima-nova', Arial;
}

.header{
	background:#fff;
}

.container{
	max-width:1000px;
}

h1{
	margin:0 0 20px;
	font-weight:100;
}

h2{
	margin:0 0 20px;
	font-weight:100;
	font-size:26px;
}

h3{
	font-size:20px;
	margin:0 0 20px;
	font-weight:700;
}

.center-header{
	text-align:center;
	margin:0 0 40px;
	position:relative;
}

.center-header h2{
	background:#fff;
	margin:0;
	padding:0 20px;
	display:inline-block;
	position:relative;
	z-index:2;
}

.center-header::after{
	content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #000;
  top: 50%;
  z-index: 1;
  left: 0;
  position: absolute;
}

h4{
	font-size:16px;
	margin:0 0 10px;
	font-weight:700;
}

h5{
font-weight:bold;
font-size: 14px;
color: #444;
line-height: 15px;
}

h5 span{
	font-weight:normal;
	color:#999;
}

p, ul, ol{
font-size: 16px;
line-height:38px;
color: #444444;
font-weight:100;
margin:0 0 30px;
}

img{
	max-width:100%;
	height:auto!important;
}

input[type="text"].form-control{
	border-radius:999px;
	background:#fafafa;
	font-size:16px;
	padding:8px 12px;
	border:1px solid #eee;
	box-shadow:none;
	height:auto;
}

.btn-dark{
	background:#333;
	color:#fff;
}
.navbar-friendship{
margin:0;
border:none;
position:relative;
z-index:9999;
border-bottom:1px solid #eee;
}

.navbar-friendship .navbar-brand{
	height:auto;
}

.navbar-friendship ul.nav>li>a{
	padding:25px 15px 26px;
	font-size:16px;
	color:#000;
}

.navbar-friendship ul.nav>li>a:hover{
	background:none;
	color:#ccc;
}

.navbar-friendship ul.nav>li:last-child>a{
	color:#004a63;
	font-weight:bold;
}

.navbar-friendship .navbar-toggle{
	margin-top:17px;
}

.navbar-friendship .icon-bar{
	background:#000;
}








.navbar-friendship ul.nav>li {
  position: relative;
}

.navbar-friendship ul.nav>li>a{
 -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
.navbar-friendship ul.nav>li>a:hover {
  background: #f9f9f9;
  color: #000;
}
.navbar-friendship ul.nav>li>ul {
  padding: 0;
  position: absolute;
  top: 71px;
  left: 0;
  width: 250px;
  display: none;
  opacity: 0;
list-style:none;
  -webkit-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  -ms-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  -transition: opacity 0.4s;
}
.navbar-friendship ul.nav>li>ul>li>a{ 
  background: rgba(255,255,255,0.9); 
  display: block; 
  color: #000;
padding:5px 15px;
text-decoration:none;
}
.navbar-friendship ul.nav>li>ul>li>a:hover{
background:#fff;
color:#999;
}
.navbar-friendship ul.nav>li:hover>ul {
  display: block;
  opacity: 1;
box-shadow:0 5px 5px rgba(0,0,0,0.2);
}











.search{
  background:#fafafa;
  border:1px solid #ededed;
  border-radius:1000px;
  display: inline-block;
  position: relative;
  padding: 0;
  float:right;
  position: relative;
padding:5px;
margin:15px 0 0 30px;
}

.search input[type="text"] {
  font-size: 16px;
  line-height:24px;
  display: inline-block;
  border: none;
  outline: none;
  color: #555;
  padding-right: 15px;
padding-left:12px;
  width: 0px;
  position:relative;
  background: none;
  z-index: 3;
  transition: width .4s cubic-bezier(0.000, 0.795, 0.000, 1.000);
  cursor: pointer;
}

.search input[type="text"]:focus {
  width: 300px;
  z-index: 1;
  cursor: text;
}
.search button[type="submit"] {
color:#000;
font-size:16px;
background:none;
display:none;
  display: inline-block;
  float: right;
  outline:none;
  border: none;
  position: absolute;
top:1px;
right:5px;
padding:6px;
  z-index: 2;
  cursor: pointer;
  cursor: pointer;
}

.hero{
	background:url(images/test3.jpg) no-repeat;
	background-size:cover;
	background-position:center center;
	overflow:hidden;
	margin:0 0 40px;
	border-bottom:1px solid #eee;
}

/*.hero .service-times{
	max-width:600px;
	margin:250px auto 60px;
	background:rgba(0,0,0,0.4);
	border:2px solid #fff;
	color:#fff;
	padding:15px;
	text-align:center;
	font-size:26px;
	font-weight:100;
}*/

.hero .service-times{
	margin:60px auto;
	border:none;
	color:rgba(255,255,255,0.8);
	padding:15px;
	text-align:center;
	font-size:100px;
	font-weight:700;
	text-transform:uppercase;
	line-height:70px;
}

.hero .service-times span{
	font-size:78px
}


.home-tagline h1{
	text-align:center;
	margin:0;
}

.home .pastor-widget{
	height:355px;
	background:url(images/dave-home.jpg) no-repeat;
	background-size:contain;
	position:relative;
}

.home .pastor-widget .info{
	position:absolute;
	bottom:0;
	width:100%;
	background:#fff;
	padding:20px 0 0;
}

.home .pastor-widget .info h3{
	margin:0;
}

.home .pastor-widget .info h6{
	margin:0 0 20px;
}

section, div.section{
	margin:0 0 40px;
}

.home .what-about-my-family a{
	display:block;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
}

.home .what-about-my-family a.high-school{
	background-image:url(images/home-family-high-school-hover.jpg);
}

.home .what-about-my-family a.middle-school{
	background-image:url(images/home-family-middle-school-hover.jpg);
}

.home .what-about-my-family a.infant{
	background-image:url(images/home-family-infant-hover.jpg);
}

.home .what-about-my-family a.preschool{
	background-image:url(images/home-family-preschool-hover.jpg);
}

.home .what-about-my-family a img{
	opacity:1;
	transition: all 0.5s;
}

.home .what-about-my-family a:hover img{
	opacity:0;
}

.page-header{
	height:300px;
	background:#eee;
	position:relative;
	margin:0;
	background-size:cover;
	background-position:center center;
}

.page-header-sm{
	height:150px;
}

.page-header-messages{
	background-image:url(images/header-messages.jpg);
}

.page-header .title{
	position:absolute;
	bottom:0;
	width:100%;
	background:rgba(0,0,0,0.4);
	color:#fff;
}

.page-header .title h2{
	padding:15px 0;
	margin:0;
	font-weight:100;
}

.breadcrumbs{
	padding:15px;
	font-size:12px;
	border-bottom:1px solid #eee;
}

.main{
	background:#fff;
}

.main-inner{
  margin: 0 auto;
  padding: 60px 20px;
  width: 1040px;
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
}

.series-description{
	margin:0 0 60px;
}

ul.series-topics {
	list-style:none;
	padding:0;
}

ul.series-topics li{
	display:inline;
	margin:0 10px 0 0;
}

ul.series-topics li a{
	display:inline-block;
	font-size:12px;
	line-height:18px;
	padding:2px 10px;
	border:1px solid #333;
	color:#333;
	text-decoration:none;
	font-weight:400;
}

ul.series-topics li a:hover{
	background:#333;
	color:#fff;
}

.messages .messages-search{
	margin-bottom:80px;
	text-align:center;
}

.grid-block{
	margin-bottom:30px;
}

.message-single-content h2{
	text-align:center;
	font-weight:100;
	color:#666;
	margin:0 0 40px;
}

.message-single-header{
	text-align:center;
	margin:0 0 40px;
}

.repeater .page h1{
	margin-top:60px;
}

.repeater-graphic .repeater-graphic-inner{
	padding:80px 40px 40px;
	min-height:300px;
	background:#eee;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
}

.repeater-graphic-inner h1, 
.repeater-graphic-inner h2, 
.repeater-graphic-inner p, 
.repeater-graphic-inner a{
	color:#fff;	
}

.repeater-graphic-inner h1,
.repeater-graphic-inner h2, 
.repeater-graphic-inner p, 
.repeater-graphic-inner a{
	text-transform:uppercase;
	margin:0 0 10px;
}

.repeater-graphic-inner h1{
	line-height:26px;
}
 
.repeater-graphic-inner h2{
	font-weight:700;
}

.repeater-graphic-inner .btn{
	border:1px solid rgba(255,255,255,1);
	color:#fff;
}

.repeater-graphic-inner .btn:hover{
	background:rgba(255,255,255,0.3);
}

.repeater-graphic:nth-child(even) .repeater-graphic-inner{
	padding-left:50%;
}

.staff-list .staff-box{
	text-align:center;
	margin-bottom:80px;
	padding:20px;
}

.staff-list a{
	text-decoration:none;
	color:#444;
}
.staff-list a .avatar,
.staff-list a h2,
.staff-list a h5{
	opacity:1;
	transition: all 0.3s;
}

.staff-list a:hover .avatar,
.staff-list a:hover h2,
.staff-list a:hover h5{
	opacity:0.5;
}

.staff-box h2{
	margin:0 0 10px;
}

.staff-single-meta{
	text-align:center;
}

.staff-single-meta h1,
.staff-single-meta h3{
	margin:0 0 10px;
}

.staff-single-meta .social{
	margin:0 0 40px;
}

.staff-single-meta .social a{
	margin:0 10px;
	font-size:26px;
}	

.page h1{
	padding-bottom:60px;
	margin:0 0 60px;
	color:#ccc;
	border-bottom:1px solid #eee;
}

.page .gallery img{
	margin-bottom:30px;
}

.event.grid-block h1{
	margin:20px 0 0;
	text-transform:uppercase;
}

.event.grid-block h1 span.month{
	font-weight:600;
}

.event.grid-block a{
	color:#444;
	text-decoration:none;
}

.event.grid-block a img,
.event.grid-block a h1{
	opacity:1;
	transition: all 0.3s;
}

.event.grid-block a:hover img,
.event.grid-block a:hover h1{
	opacity:0.5;
}

.event-title{
	text-align:center;
}

.event-title h1{
	padding-bottom:60px;
	margin:0 0 60px;
	color:#ccc;
	border-bottom:1px solid #eee;
}

.event-header{
	height:400px;
	margin:0 -35px;
	background:#eee;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
}







.avatar{
	width: 100%;
	height: 0;
	padding-bottom: 100%;
	margin:0 auto 20px;
	background:#f9f9f9 no-repeat;
	background-size:cover;
	background-position:center center;
	border-radius:9999px;
	box-shadow:inset 0 0 20px rgba(0,0,0,0.5);
}

.avatar-sm{
	width:100px;
	height:100px;
	padding:0;
}

.avatar-lg{
	width:300px;
	height:300px;
	padding:0;
}


.footer{
	background:#222;
	margin-top:60px;
	color:#999;
	padding:20px 0;
}

.footer .address{
	line-height:34px;
}

.footer .social{
	text-align:right;
}

.footer .social a{
	margin:0 0 0 20px;
	color:#fff;
	text-decoration:none;
	font-size:24px;
	opacity:1;
	transition:opacity 0.5s;
}

.footer .social a:hover{
	opacity:0.2;
}



img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}







































.mejs-button button 
            {

                /* struture */
                display: block!important;
                height: 12px!important;
                width: 12px!important;
                padding: 0!important;
                border: 0!important;
                background-repeat: no-repeat!important;

                /* font */
                font-size: 0!important;
                line-height: 0!important;

                /* theme */
                opacity: 0.7!important;
                cursor: pointer!important;
            }

            /* show the button without opacity when hover */
            .mejs-button button:hover { opacity: 1!important; }

            /* ===== $PLAY / PAUSE / STOP ===== */

	    .mejs-offscreen {display:none!important}

            .mejs-playpause-button {}

            .mejs-play {} /* Class when playing. */

            .mejs-play {} /* Class when paused. */

            .mejs-stop {} /* Stop button. */

                .mejs-playpause-button button {}

                .mejs-controls .mejs-play button  { background-position: 0 0!important; margin:5px!important;}
                .mejs-controls .mejs-pause button { background-position: -12px 0!important; }
                .mejs-controls .mejs-stop button  { background-position: -24px 0!important; }
                .mejs-controls .mejs-mute button  { background-position: -48px 0!important; }
                .mejs-controls .mejs-unmute button  { background-position: -48px -12px!important; }

		.mejs-controls .mejs-time-rail .mejs-time-total, .mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
  			background: rgba(0,0,0, 0.1)!important;
		}

.mejs-controls div.mejs-time-rail {padding-top:2px!important}

.mejs-horizontal-volume-total, .mejs-horizontal-volume-current {top:9px!important}

.mejs-controls a:focus {box-shadow:none!important}
.mejs-controls .mejs-time-rail .mejs-time-float {border:none!important}
.mejs-controls .mejs-time-rail .mejs-time-float-current { margin:4px 3px!important}