/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 200;

}

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 60px;

}

#navbar{
    border:0px solid yellow;
    background-color: rgba(255,255,255,1);
}

/****************** overide css ***************/

.top-header-bar {
    background: #23AC42;
    color: #fff;
}

.btn.orange-border:hover, .btn.gradient-bg {
    border-color: transparent;
    background: -moz-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,90,0,1)), color-stop(100%, rgba(1255,54,0,1)));
    background: -webkit-linear-gradient(
180deg
, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -o-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -ms-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: linear-gradient(
270deg
, #22ad42 0%, #28a745 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#22ad42', endColorstr='#28a745',GradientType=1 );
    color: #fff;
}

.hero-slider .swiper-button-next, .hero-slider .swiper-button-prev {
    width: 70px;
    height: 70px;
    margin-top: -35px;
    border-radius: 50%;
    background: -moz-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,90,0,1)), color-stop(100%, rgba(1255,54,0,1)));
    background: -webkit-linear-gradient(
180deg
, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -o-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: -ms-linear-gradient(180deg, rgba(255,90,0,1) 0%, rgba(255,54,0,1) 100%);
    background: linear-gradient(
270deg
, rgba(0,146,63,1) 0%, rgba(25,158,80,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00923f', endColorstr='#199e50',GradientType=1 );
    transition: all .35s;
}

.site-navigation ul li a:hover, .site-navigation ul li.current-menu-item a {
    border-bottom: 3px solid #16c960;
    color: #16c960;
}

.btn.orange-border {
    border-color: #16c960;
}

.welcome-content .entry-title {
    position: relative;
    padding-bottom: 24px;
    font-size: 36px;
    font-weight: 600;
    color: #333;
}

.welcome-content .entry-title::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 64px;
    height: 4px;
    border-radius: 2px;
    background: #16c960;
}

.welcome-content .entry-content {
    font-size: 14px;
    line-height: 2;
    color: #999;
}

.icon-box:hover, .icon-box.active {
    border: 0;
    background: -moz-linear-gradient(180deg, rgba(25,158,80,1) 0%, rgba(0,146,63,1) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0,146,63,1)), color-stop(100%, rgba(1255,54,0,1)));
    background: -webkit-linear-gradient(180deg, rgba(25,158,80,1) 0%, rgba(0,146,63,1) 100%);
    background: -o-linear-gradient(180deg, rgba(25,158,80,1) 0%, rgba(0,146,63,1) 100%);
    background: -ms-linear-gradient(180deg, rgba(25,158,80,1) 0%, rgba(0,146,63,1) 100%);
    background: linear-gradient(270deg, rgba(25,158,80,1) 0%, rgba(25,58,80,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#16c960', endColorstr='#199e50',GradientType=1 );
    color: #fff;
}

.section-heading .entry-title::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 64px;
    height: 4px;
    border-radius: 2px;
    background: #16c960;
}

/**************** GO TO TOP ******************/

#gotoTop {
    display: none;
    z-index: 599;
    position: fixed;
    width: 40px;
    height: 40px;
    background-color: #333;
    background-color: rgba(0, 0, 0, .3);
    font-size: 1.75rem;
    line-height: 36px;
    text-align: center;
    color: #fff;
    top: auto;
    left: auto;
    right: 30px;
    bottom: 30px;
    cursor: pointer;
    border-radius: 2px
}

body:not(.device-touch) #gotoTop {
    transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -o-transition: background-color .2s linear
}

.stretched #gotoTop {
    bottom: 30px
}

#gotoTop:hover {
    background-color: #1abc9c
}

h1, h2, h3, h4, h5, h6 {
     /*color: #ffffff; */
    font-weight: 700;
    letter-spacing: -.050em;
}

a:link{
    text-decoration: none;
}

.mycontainer{
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 48%; /*75%;  4:3 Aspect Ratio */ /*100%;  1:1 Aspect Ratio */ /*56.25%;  16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
}

/* Then style the iframe to fit in the container div with full height and width */
.myresponsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 992px) {
    .hero-slider{
        /*display: none !important;*/
        height: 400px !important;
        
    }

    .top-header-bar {
        display: none !important;
    }

    .entry-content p{
        display: inline-block !important;
    }

    .entry-footer{
        display: inline-block !important;
    }

    .swiper-button-next, .swiper-button-prev {
        display: inline-block !important;
        position: absolute !important;
        top: 80% !important;
        width: 27px;
        height: 44px;
        margin-top: -22px;
        z-index: 10;
        cursor: pointer;
        background-size: 27px 44px;
        background-position: center;
        background-repeat: no-repeat;
        border: 1px solid white !important;

    }




}

.icon-box{
        /*height: 350px;*/
    }
.about-more{
    color: rgba(255,54,0,0.8) !important;
}

.church-page-welcomex {
    position: relative;
    padding: 96px 0;
    background: url("../../images/tcnc_founder.jpeg") no-repeat 80%;
    /*background: url("../../images/welcome-bg.jpeg") no-repeat center;*/
    background-size: contain;
    z-index: 99;
}
