/* Template Name: Jesus Youth Author: JY GROUP Author URI: Designer : Manu Marshal;
 Designer Url: manumarshel@gmail.com;
 Description: Version: 1.0 */
/*------------------------------------------------------------------ -------------------------------------------------------------------*/
/* [ GENERAL ] */
/*================================================== */
body {
     font: 14px/22px 'Roboto', sans-serif;
     color: #6e6e6e;
     background-color: #222;
     padding: 0 !important;
     position: relative;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
}

h3.fulltext {
    font-size: 6rem !important;
    color: #fff !important;
    line-height: 8rem !important;
    margin: 0px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    padding-bottom: 14px !important;
    text-align: center !important;
    margin-top: 6rem !important;
}
h3.fulltext span {
    font-size: 2rem !important;
}
@font-face {
     font-family: 'NavithScriptDemo';
     src: url('../fonts/Novitha_Script-Demo.ttf');
}

.wrapper {
     overflow: hidden;
     background-color: #fff;
}

.section-overlay {
     background-color: rgba(0, 0, 0, 0.7);
}

hr {
     margin-top: 25px;
}

.unstyled {
     margin: 0;
     padding: 0;
     list-style-type: none;
}


/* Boxed Body */

body.boxed header {
     max-width: 1220px;
}

body.boxed .wrapper {
     max-width: 1220px;
     margin: 0 auto;
     background: #fff;
     box-shadow: 0px 3px 8px 7px #ccc;
}

body.boxed {
     background: url(../img/backgrounds/az_subtle.png);
     background-attachment: fixed;
}


/* Dark Body */

body.dark {
     color: #ccc;
}

body.dark p,
body.dark h1,
body.dark h2,
body.dark h4,
body.dark h5,
body.dark h6,
body.dark .portfolio .caption h3,
body.dark .portfolio .nav-pills li {
     color: #eee;
}

body.dark.boxed .wrapper,
body.dark .wrapper {
     background-color: #242424;
}

body.dark.blog-page article h4,
body.dark .sidebar .widget-title,
body.dark .widget.recent-posts .entry-title a,
body.dark .about .about-content .title-about,
body.dark ul.navbar-nav>li>a,
body.dark .header-fixed ul.navbar-nav li a,
body.dark .comments-heading,
body.dark .comments-list .comment-author,
body.dark .project .project-details h3,
body.dark .latest-post .post-title a,
body.dark .header-fixed .nav-menu ul.nav-menu-inner li a,
body.dark .widget-tags ul>li a:hover {
     color: #fff;
}

body.dark ul.nav.nav-tabs li a,
ul.nav.nav-tabs li.active a {
     color: #ddd;
}

body.dark .header.header-fixed {
     background-color: #000000 !important;
     /*     border-bottom: 1px solid #343434;*/
}

body.dark .header.header-fixed #icon-toggler span {
     background-color: #fff;
}

body.dark .sidebar ul.nav.nav-tabs li a {
     color: #ddd;
}

body.dark.blog-page .meta {
     border-top: 1px solid #343434;
     border-bottom: 1px solid #343434;
}

body.dark .sidebar ul.nav-tabs li,
body.dark .widget.recent-posts ul li {
     border-bottom: 1px solid #444;
}

body.dark .sidebar ul.nav-tabs li:last-child,
body.dark.blog-page .widget.recent-posts ul li:last-child {
     border-bottom: 0;
}

body.dark .widget,
body.dark .comments-list .comment,
body.dark.blog-page .pagination li a:hover,
body.dark .custom-form input[type=text],
body.dark .custom-form input[type=email],
body.dark .custom-form input[type=password],
body.dark .custom-form textarea {
     background-color: #343434;
}

body.dark.blog-page .pagination li a {
     border: 1px solid #343434;
     color: #fff;
}

body.dark .custom-form input[type=text],
body.dark .custom-form input[type=email],
body.dark .custom-form textarea {
     border: 1px solid #444;
     color: #fff;
}

body.dark .custom-form input[type=text]:focus,
body.dark .custom-form input[type=text]:active,
body.dark .custom-form input[type=email]:focus,
body.dark .custom-form input[type=email]:active,
body.dark .custom-form textarea:focus,
body.dark .custom-form textarea:active {
     border: 1px solid #555;
     background-color: #343434;
}

body.dark .about ul.nav.nav-tabs li>a {
     border-left: 1px solid #aaa;
}

body.dark .about ul.nav.nav-tabs li:first-child>a {
     border-left: 0;
}

body.dark .services-box-item-cover,
body.dark .services-box-item-content {
     background: #151515;
     box-shadow: none;
}

body.dark .about .about-content .about-right-side img {
     border: 0;
}

body.dark hr {
     border-top: 1px solid #343434;
     background-color: transparent;
}

body.dark .caption p,
body.dark .services-box-item-content p,
body.dark .info-map-boxes-item p {
     color: #ccc;
}

body.dark .team-member {
     box-shadow: none;
}

body.dark .team-member-caption {
     background-color: #151515;
}

body.dark .info-map-boxes-item {
     background-color: #343434;
     box-shadow: none;
}

body.dark .info-map-boxes-item:before {
     background-color: #343434;
}

body.dark .info-map-boxes-item h1 {
     border-bottom: 1px solid #444;
}

body.dark .gmap_container {
     color: #6e6e6e;
}

body.dark.reversed-skew .logos {
     margin-top: -50px;
     padding-top: 27px;
     margin-bottom: -115px;
     padding-bottom: 95px;
}

body.dark.skew .logos {
     margin-top: -50px;
     padding-top: 50px;
     margin-bottom: -82px;
     padding-bottom: 80px;
}

body.dark.big-triangle .projectmanager:after,
body.dark.big-triangle .projectmanager:before,
body.dark.big-triangle .mainslider:after,
body.dark.big-triangle .mainslider:before,
body.dark.big-triangle .testimonials:after,
body.dark.big-triangle .testimonials:before,
body.dark.big-triangle .newsletter:after,
body.dark.big-triangle .newsletter:before,
body.dark.big-triangle .facts:after,
body.dark.big-triangle .facts:before,
body.dark.big-triangle .videopromotion:after,
body.dark.big-triangle .videopromotion:before,
body.dark.big-triangle .contactform:after,
body.dark.big-triangle .contactform:before,
body.dark.big-triangle .banner:after,
body.dark.big-triangle .banner:before {
     border-bottom: 100px solid #242424;
}

body.dark.big-triangle .projectmanager:after,
body.dark.big-triangle .projectmanager:before,
body.dark.big-triangle .testimonials:after,
body.dark.big-triangle .testimonials:before,
body.dark.big-triangle .newsletter:after,
body.dark.big-triangle .newsletter:before,
body.dark.big-triangle .facts:after,
body.dark.big-triangle .facts:before,
body.dark.big-triangle .call-to-action:after,
body.dark.big-triangle .call-to-action:before,
body.dark.big-triangle .videopromotion:after,
body.dark.big-triangle .videopromotion:before,
body.dark.big-triangle .contactform:after,
body.dark.big-triangle .contactform:before {
     border-top: 100px solid #242424;
}

body.dark .footer {
    background: #181818;
    padding-bottom: 0px !important;
    margin-bottom: -15px !important;
}


/* Body Separators ================================================== */


/* Normal */

body.normal .videopromotion .section-overlay {
     padding: 90px 0 106px;
}

body.normal .newsletter .section-overlay {
     padding: 90px 0 112px;
}

body.normal .facts .section-overlay {
     padding: 90px 0 84px;
}

body.normal .call-to-action .section-overlay {
     padding: 90px 0 110px;
}

body.normal .testimonials .section-overlay {
     padding: 90px 0 137px;
}

body.normal .services .container {
     padding: 90px 15px 72px !important
}

body.normal .portfolio .container {
     padding: 90px 0 96px !important;
}

body.normal .pricing .container {
     padding: 90px 15px 96px !important;
}

body.normal .blog .container {
     padding: 90px 15px 112px !important;
}

body.normal.blog-page .blog .container {
     padding: 100px 15px 70px !important;
}

body.normal .contactform .section-overlay {
     padding: 90px 0 60px !important;
}

body.normal .project .container {
     padding: 120px 15px;
}

body.normal .shop-cart .container,
body.normal .shop-checkout .container {
     padding: 100px 15px;
}

body.normal .terms .container {
     padding: 70px 15px;
}


/* Skew */

body.skew .about,
body.skew .faq,
body.skew.portfolio-page .portfolio,
body.skew .terms,
body.skew .shop-cart,
body.skew .shop-checkout,
body.skew.pricing-page .pricing,
body.skew .project,
body.skew .projectmanager,
body.skew .services,
body.skew .pricing,
body.skew .testimonials,
body.skew .team,
body.skew .blog,
body.skew .facts,
body.skew .call-to-action,
body.skew .newsletter,
body.skew .contactform,
body.skew .videopromotion {
     -webkit-transform: skewY(-3deg);
     transform: skewY(-3deg);
}

body.skew .about .container,
body.skew .faq .container,
body.skew.portfolio-page .portfolio .container,
body.skew .terms .container,
body.skew .shop-cart .container,
body.skew .shop-checkout .container,
body.skew.pricing-page .pricing .container,
body.skew .project .container,
body.skew .projectmanager .container,
body.skew .services .container,
body.skew .pricing .container,
body.skew .testimonials .container,
body.skew .team .container,
body.skew .blog .container,
body.skew .facts .container,
body.skew .call-to-action .container,
body.skew .newsletter .container,
body.skew .contactform .container,
body.skew .videopromotion .container {
     -webkit-transform: skewY(3deg);
     transform: skewY(3deg);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
}

body.skew .about,
body.skew .faq,
body.skew.portfolio-page .portfolio,
body.skew .terms,
body.skew .shop-cart,
body.skew .shop-checkout,
body.skew .project,
body.skew.pricing-page .pricing {
     margin-top: -55px;
}

body.skew .portfolio {
     margin-top: -20px;
     padding-top: 17px;
}

body.skew .contact {
     margin-bottom: 100px;
     margin-top: -60px;
     padding-top: 60px;
}

body.skew .contactform {
     margin-top: -150px;
}

body.skew .about .container {
     padding: 70px 15px 150px;
}

body.skew .faq .container,
body.skew .terms .container {
     padding: 140px 15px 70px;
}

body.skew .shop-cart .container,
body.skew .shop-checkout .container {
     padding: 140px 15px 100px;
}

body.skew .project .container {
     padding: 140px 15px 100px;
}

body.skew .services .container {
     padding: 70px 15px 90px;
}

body.skew .pricing .container {
     padding: 100px 15px 94px !important;
}

body.skew .portfolio .container {
     padding: 70px 15px 100px;
}

body.skew .team .container {
     padding: 70px 15px 120px;
}

body.skew .blog .container {
     padding: 90px 15px 112px !important;
}

body.skew.blog-page .blog .container {
     padding: 70px 15px 30px !important;
}

body.skew.about-page .about .container,
body.skew.about-page .team .container {
     padding: 100px 15px 120px !important;
}

body.skew.about-page .services .container {
     padding: 100px 15px !important;
}

body.skew.blog-page .blog {
     margin-top: -55px;
     padding-top: 55px;
}

body.skew .bx-wrapper {
     margin: 90px 0 60px;
}

body.skew .videopromotion .section-overlay {
     padding: 90px 0 112px;
}

body.skew .testimonials .section-overlay {
     padding: 90px 0 135px;
}

body.skew .facts .section-overlay {
     padding: 90px 0;
}

body.skew .contactform .section-overlay {
     padding: 90px 0 60px !important;
}

body.skew .info-map-boxes {
     margin-top: -285px;
     padding-bottom: 130px;
}

body.skew .footer {
     -webkit-transform: skewY(-3deg);
     transform: skewY(-3deg);
     margin-top: 30px;
     margin-bottom: -50px;
     padding-bottom: 50px;
     border: none;
}

body.skew .footer .container {
     -webkit-transform: skewY(3deg);
     transform: skewY(3deg);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     padding: 120px 0;
}


/* Reversed Skew */

body.reversed-skew .about {
     margin-top: -55px;
     margin-bottom: 120px;
}

body.reversed-skew .faq,
body.reversed-skew.portfolio-page .portfolio,
body.reversed-skew .terms,
body.reversed-skew .shop-cart,
body.reversed-skew .shop-checkout,
body.reversed-skew.pricing-page .pricing {
     margin-top: -55px;
}

body.reversed-skew .about .container {
     padding: 70px 15px 100px;
}

body.reversed-skew .faq .container,
body.reversed-skew.portfolio-page .portfolio .container {
     padding: 140px 15px 100px;
}

body.reversed-skew .terms .container {
     padding: 140px 15px 70px;
}

body.reversed-skew .shop-cart .container,
body.reversed-skew .shop-checkout .container {
     padding: 140px 15px 100px;
}

body.reversed-skew.pricing-page .pricing .container {
     padding: 100px 15px 120px !important;
}

body.reversed-skew .services .container {
     padding: 70px 15px 90px;
}

body.reversed-skew .pricing .container {
     padding: 70px 15px 100px !important;
}

body.reversed-skew .portfolio .container {
     padding: 70px 0 100px !important;
}

body.reversed-skew .project .container {
     padding: 140px 15px 100px !important;
}

body.reversed-skew .team .container {
     padding: 70px 15px 120px;
}

body.reversed-skew .blog .container {
     padding: 70px 15px 100px !important;
}

body.reversed-skew .about,
body.reversed-skew .faq,
body.reversed-skew.portfolio-page .portfolio,
body.reversed-skew .terms,
body.reversed-skew .shop-cart,
body.reversed-skew .shop-checkout,
body.reversed-skew.pricing-page .pricing,
body.reversed-skew .call-to-action,
body.reversed-skew .testimonials,
body.reversed-skew .newsletter,
body.reversed-skew .project,
body.reversed-skew .contactform .container,
body.reversed-skew.blog-page .blog {
     -webkit-transform: skewY(-3deg);
     transform: skewY(-3deg);
}

body.reversed-skew .projectmanager,
body.reversed-skew .about .container,
body.reversed-skew .faq .container,
body.reversed-skew.portfolio-page .portfolio .container,
body.reversed-skew .terms .container,
body.reversed-skew .shop-cart .container,
body.reversed-skew .shop-checkout .container,
body.reversed-skew.pricing-page .pricing .container,
body.reversed-skew .videopromotion,
body.reversed-skew .facts,
body.reversed-skew .call-to-action,
body.reversed-skew .project .container,
body.reversed-skew .testimonials .container,
body.reversed-skew .newsletter .container,
body.reversed-skew .contactform,
body.reversed-skew.blog-page .blog .container {
     -webkit-transform: skewY(3deg);
     transform: skewY(3deg);
}

body.reversed-skew.blog-page .blog {
     margin-top: -55px;
     padding-top: 55px;
     padding-bottom: 0;
}

body.reversed-skew .project {
     margin-top: -55px;
}

body.reversed-skew .projectmanager {
     margin-top: -100px;
}

body.reversed-skew.about-page .services .container {
     padding: 0 !important;
}

body.reversed-skew.about-page .about .container,
body.reversed-skew.about-page .team .container {
     padding: 100px 15px 120px !important;
}

body.reversed-skew .about .container,
body.reversed-skew .faq .container,
body.reversed-skew.portfolio-page .portfolio .container,
body.reversed-skew .terms .container,
body.reversed-skew .shop-cart .container,
body.reversed-skew .shop-checkout .container {
     backface-visibility: hidden;
}

body.reversed-skew .services,
body.reversed-skew .pricing,
body.reversed-skew .team {
     padding-bottom: 100px;
     margin-top: -50px;
     border-top: 60px solid #efefef;
}

body.reversed-skew .services {
     margin-top: -72px;
}

body.reversed-skew.about-page:not(.dark) .services {
     padding-bottom: 170px;
     margin-top: -150px;
     border-top: 160px solid #efefef;
     margin-bottom: -60px;
}

body.reversed-skew.portfolio-page .portfolio .container {
     padding: 100px 15px 70px !important;
}

body.reversed-skew.pricing-page .pricing {
     border-top: 0;
     padding-bottom: 0;
}

body.reversed-skew .blog {
     padding-bottom: 100px;
     margin-top: -88px;
}

body.dark.reversed-skew .services,
body.dark.reversed-skew .pricing,
body.dark.reversed-skew .team {
     border-top: 60px solid #242424;
}

body.reversed-skew .testimonials,
body.reversed-skew .newsletter {
     margin-top: -100px;
     margin-bottom: 100px;
}

body.reversed-skew .videopromotion {
     margin-top: -100px;
}

body.reversed-skew .portfolio {
     margin-top: -88px;
}

body.reversed-skew .contact {
     margin-bottom: 100px;
     margin-top: -60px;
     padding-top: 60px;
}

body.reversed-skew .contactform {
     margin-top: -150px;
}

body.reversed-skew .contactform .section-overlay {
     padding: 90px 0 60px !important;
}

body.reversed-skew .videopromotion .section-overlay {
     padding: 90px 0 112px;
}

body.reversed-skew .testimonials .section-overlay {
     padding: 90px 0 135px !important;
}

body.reversed-skew .facts .section-overlay {
     padding: 90px 0 !important;
}

body.reversed-skew .bx-wrapper {
     margin: 120px 0 80px;
}

body.reversed-skew .info-map-boxes {
     margin-top: -285px;
     padding-bottom: 130px;
}

body.reversed-skew .footer {
     -webkit-transform: skewY(-3deg);
     transform: skewY(-3deg);
     margin-top: 28px;
     margin-bottom: -50px;
     padding-bottom: 50px;
     border: none;
}

body.reversed-skew .footer .container {
     -webkit-transform: skewY(3deg);
     transform: skewY(3deg);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
     padding: 120px 0;
}

body.reversed-skew .projectmanager .container,
body.reversed-skew .facts .container,
body.reversed-skew .call-to-action .container,
body.reversed-skew .videopromotion .container {
     -webkit-transform: skewY(-3deg);
     transform: skewY(-3deg);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
}

body.double-diagonal section {
     position: relative;
     z-index: 1;
}

body.double-diagonal .logos {
     padding: 1px 0;
}

body.double-diagonal .about.safari::before {
     height: 33px;
     background-color: transparent !important;
}

body.double-diagonal .videopromotion .section-overlay {
     padding: 120px 0 180px;
}

body.double-diagonal .contactform .section-overlay {
     padding: 120px 0;
}

body.double-diagonal .bx-wrapper {
     margin: 50px 0;
}

body.double-diagonal .contactform {
     margin-top: -100px;
}

body.double-diagonal .info-map-boxes {
     margin-top: -186px;
     padding-bottom: 80px;
}


/* Big Triangle */

body.big-triangle .projectmanager,
body.big-triangle .mainslider,
body.big-triangle .testimonials,
body.big-triangle .facts,
body.big-triangle .call-to-action,
body.big-triangle .contactform,
body.big-triangle .newsletter,
body.big-triangle .videopromotion,
body.big-triangle .footer,
body.big-triangle .banner {
     position: relative;
     -webkit-backface-visibility: hidden;
}

body.big-triangle .projectmanager .container,
body.big-triangle .mainslider .container,
body.big-triangle .testimonials .container,
body.big-triangle .facts .container,
body.big-triangle .call-to-action .container,
body.big-triangle .contactform .container,
body.big-triangle .newsletter .container,
body.big-triangle .videopromotion .container {
     position: relative;
     z-index: 999;
}

body.big-triangle .projectmanager:after,
body.big-triangle .projectmanager:before,
body.big-triangle .mainslider:after,
body.big-triangle .mainslider:before,
body.big-triangle .testimonials:after,
body.big-triangle .testimonials:before,
body.big-triangle .newsletter:after,
body.big-triangle .newsletter:before,
body.big-triangle .facts:after,
body.big-triangle .facts:before,
body.big-triangle .call-to-action:after,
body.big-triangle .call-to-action:before,
body.big-triangle .contactform:after,
body.big-triangle .contactform:before,
body.big-triangle .videopromotion:after,
body.big-triangle .videopromotion:before,
body.big-triangle .footer:after,
body.big-triangle .footer:before,
body.big-triangle .banner:after,
body.big-triangle .banner:before {
     content: "";
     position: absolute;
     bottom: -1px;
     top: 0;
     width: 50%;
     z-index: 100;
     border-top: 100px solid #fff;
     border-bottom: 100px solid #fff;
     -webkit-transform: rotate(0.000001deg);
     transform: rotate(0.000001deg);
}

body.about-page.big-triangle .call-to-action:after,
body.about-page.big-triangle .call-to-action:before {
     border-top: 100px solid #efefef;
}

body.big-triangle.about-page .testimonials:after,
body.big-triangle.about-page .testimonials:before {
     border-bottom: 100px solid #efefef;
}

body.big-triangle .mainslider:after,
body.big-triangle .mainslider:before,
body.big-triangle .banner:after,
body.big-triangle .banner:before {
     top: initial;
     border-top: none;
}

body.big-triangle .testimonials:after,
body.big-triangle .testimonials:before,
body.big-triangle .newsletter:after,
body.big-triangle .newsletter:before,
body.big-triangle .contactform:after,
body.big-triangle .contactform:before,
body.big-triangle .contactform:after,
body.big-triangle .contactform:before {
     border-top: 100px solid #efefef;
}

body.big-triangle .services .container {
     padding: 90px 15px 72px !important;
}

body.big-triangle .testimonials .section-overlay {
     padding: 90px 0 135px;
}

body.big-triangle .facts .section-overlay {
     padding: 90px 0;
}

body.big-triangle .newsletter .section-overlay {
     padding: 90px 0 112px !important;
}

body.big-triangle .portfolio .container {
     padding: 90px 0 96px !important;
}

body.big-triangle .team .container {
     padding: 70px 15px 100px;
}

body.big-triangle .testimonials .carousel-indicators {
     z-index: 111;
}

body.big-triangle .projectmanager:after,
body.big-triangle .projectmanager:before,
body.big-triangle .facts:after,
body.big-triangle .facts:before,
body.big-triangle .videopromotion:after,
body.big-triangle .videopromotion:before,
body.big-triangle .footer:after,
body.big-triangle .footer:before {
     border-bottom: 100px solid #efefef;
}

body.big-triangle .mainslider:before,
body.big-triangle .projectmanager:before,
body.big-triangle .testimonials:before,
body.big-triangle .newsletter:before,
body.big-triangle .facts:before,
body.big-triangle .call-to-action:before,
body.big-triangle .contactform:before,
body.big-triangle .videopromotion:before,
body.big-triangle .footer:before,
body.big-triangle .banner:before {
     right: 50%;
     border-right: 1000px solid transparent;
     border-left: 1000px solid;
}

body.big-triangle .mainslider:after,
body.big-triangle .projectmanager:after,
body.big-triangle .testimonials:after,
body.big-triangle .newsletter:after,
body.big-triangle .facts:after,
body.big-triangle .call-to-action:after,
body.big-triangle .contactform:after,
body.big-triangle .videopromotion:after,
body.big-triangle .footer:after,
body.big-triangle .banner:after {
     left: 50%;
     border-left: 1000px solid transparent;
     border-right: 1000px solid;
}

body.big-triangle .blog .container {
     padding: 90px 15px !important;
}

body.big-triangle.blog-page .blog .container {
     padding: 100px 15px 50px !important;
}

body.big-triangle .call-to-action .section-overlay {
     padding: 90px 0 112px;
}

body.big-triangle .videopromotion .section-overlay {
     padding: 90px 0 106px;
}

body.big-triangle .project .container {
     padding: 100px 15px;
}

body.big-triangle .shop-cart .container,
body.big-triangle .shop-checkout .container,
body.big-triangle .terms .container {
     padding: 100px 15px;
}

body.big-triangle .contactform .section-overlay {
     padding: 90px 0;
}

body.big-triangle .footer:after,
body.big-triangle .footer:before {
     bottom: initial;
     border-bottom: none;
}

body.big-triangle .footer {
     border-top: none;
}

body.big-triangle .footer .container {
     padding: 120px 0;
}

body.big-triangle .bx-wrapper {
     margin: 70px 0 60px;
}
.footer {
    border: none !important;
}

/* Heading */

h1,
h2,
h3,
h4,
h5,
h6 {
     color: #555;
       text-transform: capitalize;
     font-family: 'Roboto', sans-serif;
}

h1 {
     font-size: 48px;
     line-height: 48px;
     font-weight: 800;
     margin: 15px 0;
}

h2 {
     font-size: 36px;
     line-height: 36px;
     font-weight: 800;
}

h3 {
     font-size: 24px;
     line-height: 33px;
}

h4 {
     font-size: 18px;
     line-height: 18px;
}

h5 {
     font-size: 14px;
     line-height: 14px;
}

h6 {
     font-size: 12px;
     line-height: 12px;
}

.projectmanager h2,
.facts h2,
.facts h4,
.testimonials h2,
.testimonials h4,
.newsletter h2,
.newsletter h4,
.contactform h2,
.contactform h4,
.projectmanager h1,
.testimonials h1,
.facts h1,
.newsletter h1,
.contactform h1,
.videopromotion h1,
.videopromotion h4 {
     color: #fff;
}


/* Paragraph */

.footer p {
     padding-bottom: 10px;
     font-family: 'Playfair Display', serif !important;
     font-style: italic;
     color: #b9ab7a !important;
}

.social-icons {
     margin-bottom: 1rem;
}

p {
     font-family: 'Roboto', sans-serif;
     font-size: 16px;
     line-height: 1.8;
     font-weight: 400;
     margin-bottom: 15px;
     margin-top: 0px;
     color: #666;
}

.top-text h4 {
     margin: 15px 0 25px;
     font-weight: 400;
}

a,
a:hover {
     text-decoration: none !important;
}


/* Divider */

.divider span {
     display: inline-block;
     vertical-align: middle;
}

.divider .fa {
     font-size: 20px;
     margin: 0 20px;
}

.divider .outer-line {
     width: 25%;
     border-bottom: 1px solid #ddd;
}


/* [ HEADER ] */


/*================================================== */

.header {
     position: absolute;
     text-align: center;
     top: 0px;
     z-index: 1000;
     color: #fff;
     width: 100%;
     height: 70px;
     transition: background-color 200ms ease-in-out 0s;
     -o-transition: background-color 200ms ease-in-out 0s;
     -moz-transition: background-color 200ms ease-in-out 0s;
     -webkit-transition: background-color 200ms ease-in-out 0s;
}

.header.header-fixed {
     display: block;
     margin-top: 0 !important;
     position: fixed;
     height: 70px;
     background-color: #fff;
     /*border-bottom: 1px solid #f1f1f1;*/
}

.header-inner {
     padding-left: 30px;
     padding-right: 30px;
     position: relative;
}

.header-fixed .logo a {
     margin-top: 0;
     transition: all 0.3s ease 0s;
     -o-transition: all 0.3s ease 0s;
     -moz-transition: all 0.3s ease 0s;
     -webkit-transition: all 0.3s ease 0s;
}

.header-fixed .nav-menu ul.nav-menu-inner li a {
     padding: 26px 8px;
     color: #555;
}

.nav-menu ul.nav-menu-inner li:first-child a {
     border-top: 0 !important;
}

.header:before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
     width: 100%;
     height: 120px;
     background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.65) 0%, rgba(252, 252, 252, 0) 99%, rgba(255, 255, 255, 0) 100%);
     background: linear-gradient(to bottom, rgba(0, 0, 0, 0.65) 0%, rgba(252, 252, 252, 0) 99%, rgba(255, 255, 255, 0) 100%);
     filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#a6000000", endColorstr="#00ffffff", GradientType=0);
}

.header-fixed:before {
     background: none;
     height: 0;
}


/* Logo */

.logo {
     float: left;
     text-align: left;
     display: inline-block;
}

.logo a {
     width: 397px;
     display: block;
     margin-top: 30px;
     margin-bottom: 30px;
     transition: all 0.3s ease 0s;
     -o-transition: all 0.3s ease 0s;
     -moz-transition: all 0.3s ease 0s;
     -webkit-transition: all 0.3s ease 0s;
}

.logo a img {
     width: 100%;
     transition: all 0.3s ease 0s;
     -o-transition: all 0.3s ease 0s;
     -moz-transition: all 0.3s ease 0s;
     -webkit-transition: all 0.3s ease 0s;
}

.header .logo a img.logo-light {
     opacity: 1;
}

.header .logo a img.logo-dark {
     opacity: 0;
}

.header.header-fixed .logo a img.logo-light {
     opacity: 0;
}

.header.header-fixed .logo a img.logo-dark {
     opacity: 1;
}

.logo {
     float: left;
     text-align: left;
     display: inline-block;
}

.logo a {
     max-width: 100%;
     margin-top: 0px;
     transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     position: relative;
}

.logo a img {
        opacity: .9 !important;
     /*width: 100%;*/
     position: absolute;
     top: 0;
     left: 0;
     transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
     -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1) 0s;
}


/* Dark Header */

body.dark .header .logo a img.logo-light {
     opacity: 1;
}

body.dark .header .logo a img.logo-dark {
     opacity: 0;
}

body.dark .header.header-fixed .logo a img.logo-light {
     opacity: 1;
}

body.dark .header.header-fixed .logo a img.logo-dark {
     opacity: 0;
}


/* Navigation Menu */

.nav-menu {
     position: static;
     float: right;
}

.nav-menu.active {
     display: block;
}

.nav-menu ul.nav-menu-inner {
     margin: 0;
     padding: 0;
     list-style: none;
}

.nav-menu ul.nav-menu-inner li {
     display: inline-block;
     list-style: none;
     text-align: center;
}

.nav-menu ul.nav-menu-inner li a {
     display: block;
     text-decoration: none;
     color: #fff;
     font-size: 14px;
     line-height: 1;
     padding: 35px 8px;
     font-weight: 400;
     text-transform: capitalize;
     font-family: 'Roboto', sans-serif;
}

.nav-menu ul.nav-menu-inner li a i {
     font-size: 11px;
     padding-right: 3px;
}

.navbar-toggler {
     outline: none !important;
}

#icon-toggler {
     width: 20px;
     height: 21px;
     position: relative;
     margin: 23px auto;
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     transform: rotate(0deg);
     -webkit-transition: .5s ease-in-out;
     -moz-transition: .5s ease-in-out;
     -o-transition: .5s ease-in-out;
     transition: .5s ease-in-out;
     cursor: pointer;
     display: block;
}

#icon-toggler span {
     display: block;
     position: absolute;
     height: 2px;
     width: 100%;
     background-color: #fff;
     border-radius: 9px;
     opacity: 1;
     left: 0;
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     transform: rotate(0deg);
     -webkit-transition: .25s ease-in-out;
     -moz-transition: .25s ease-in-out;
     -o-transition: .25s ease-in-out;
     transition: .25s ease-in-out;
}

.header.header-fixed #icon-toggler span {
     background-color: #000;
}

#icon-toggler span:nth-child(1) {
     top: 0;
}

#icon-toggler span:nth-child(2),
#icon-toggler span:nth-child(3) {
     top: 6px;
}

#icon-toggler span:nth-child(4) {
     top: 12px;
}

#icon-toggler.open span:nth-child(1) {
     top: 18px;
     width: 0%;
     left: 50%;
}

#icon-toggler.open span:nth-child(2) {
     -webkit-transform: rotate(45deg);
     -moz-transform: rotate(45deg);
     -o-transform: rotate(45deg);
     transform: rotate(45deg);
}

#icon-toggler.open span:nth-child(3) {
     -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
     -o-transform: rotate(-45deg);
     transform: rotate(-45deg);
}

#icon-toggler.open span:nth-child(4) {
     top: 18px;
     width: 0%;
     left: 50%;
}


/* [ CONTENT ] */


/*================================================== */


/* Custom Button */

.custom-button {
     border: none;
     color: #fff;
     text-decoration: none;
     background: #00bbda;
     cursor: pointer;
     display: inline-block;
     outline: none;
     box-shadow: none;
     text-shadow: none;
     position: relative;
     letter-spacing: 0;
     -webkit-transition: all 0.3s ease 0s;
     transition: all 0.3s ease 0s;
     -webkit-transition: all 0.3s;
     transition: all 0.3s;
     margin-top: 10px;
     text-transform: uppercase;
     padding: 12px 33px;
     border-radius: 40px;
     font-size: 14px;
     font-weight: 600;
}

.custom-button span {
     position: relative;
     display: block;
     -webkit-transition: all 0.3s ease 0s;
     transition: all 0.3s ease 0s;
     -webkit-transition: all 0.3s;
     transition: all 0.3s;
}


/* Preloader ---------------------------------------- */

.preloader {
     position: fixed;
     left: 0;
     top: -100%;
     right: 0;
     height: 100%;
     z-index: 999999999999999999;
     background: #000;
     text-align: center;
     overflow: hidden;
     opacity: 1;
     -webkit-transform: translate(0, 100%);
     transform: translate(0, 100%);
}

.preloader:before {
     content: "";
     height: 100%;
     width: 0;
     display: inline-block;
     vertical-align: middle;
}

.preloader .logopreloader {
     vertical-align: middle;
     -webkit-transform: translate(0, 500px);
     transform: translate(0, 500px);
     position: relative;
     white-space: nowrap;
     display: inline-block;
     top: -20px;
     opacity: 0;
     -webkit-transition: -moz-transform 1s ease, -webkit-transform 1s ease, -ms-transform 1s ease, -o-transform 1s ease, transform 1s ease, opacity 1s ease;
     transition: -webkit-transform 1s ease, transform 1s ease, opacity 1s ease;
}

.preloader .loader {
     width: 65px;
     height: 65px;
     background-size: cover;
     position: absolute;
     left: 50%;
     top: 50%;
     margin: 15px 0 0 -32px;
     -webkit-transform: translate(0, 500px);
     transform: translate(0, 500px);
     opacity: 0;
     -webkit-transition: opacity 1s ease .3s, -webkit-transform 1s ease .3s;
     transition: opacity 1s ease .3s, -webkit-transform 1s ease .3s;
     transition: transform 1s ease .3s, opacity 1s ease .3s;
     transition: transform 1s ease .3s, opacity 1s ease .3s, -webkit-transform 1s ease .3s;
}

.preloader.loading .loader,
.preloader.loading .logopreloader {
     -webkit-transform: translate(0, 0px);
     transform: translate(0, 0px);
     opacity: 1;
}

.preloader.ended {
     -webkit-transform: translate(0, 0);
     transform: translate(0, 0);
     opacity: 0;
     -webkit-transition: -webkit-transform 1s ease 0.5s, -moz-transform 1s ease 0.5s, -ms-transform 1s ease 0.5s, -o-transform 1s ease 0.5s, transform 1s ease 0.5s, opacity 1s ease 0.5s;
     transition: -webkit-transform 1s ease 0.5s, transform 1s ease 0.5s, opacity 1s ease 0.5s;
}

.preloader.ended .loader,
.preloader.ended .logopreloader {
     -webkit-transform: translate(0, -500px);
     transform: translate(0, -500px);
     opacity: 0;
}


/* Main Slider (Revolution Slider) ---------------------------------------- */

.tp-simpleresponsive .slider-button {
     color: #fff;
     border-radius: 40px;
     padding: 12px 26px;
     font-size: 14px;
     font-weight: 600;
}

.tp-simpleresponsive .slider-button:before {
     content: "\f063";
}

.scroll-effects-text {
     color: #eee !important;
}

.nowrap-normal {
     white-space: normal !important;
}

.px-15 {
     padding: 0 15px !important;
}

.tp-parallax-wrap,
.tp-loop-wrap {
     width: 100%;
}


/* About ---------------------------------------- */

.about {
     padding: 8rem 0px;
     background-image: url(../images/friendship.jpg);
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}

.about .about-content .title-about {
     font-size: 28px;
     margin-bottom: 10px;
     margin-top: 0;
}

.about .about-right-side {
     margin-top: 22px;
     margin-left: 22px;
     position: relative;
     display: inline-block;
}

.about .about-right-side img {
     position: relative;
     display: inline-block;
     border-radius: 4px;
}

.about .about-right-side:before {
     display: inline-block;
     position: absolute;
     content: '';
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 0;
     transform: translate3d(22px, -22px, -22px);
     border-radius: 4px;
}

.about ul.nav.nav-tabs {
     border-bottom: 0;
}

.about ul.nav.nav-tabs li a,
.about ul.nav.nav-tabs li a.active {
     border-top: 0;
     border-bottom: 0;
     border-right: 0;
     border-left: 1px solid #ddd;
     border-radius: 0;
     font-size: 15px;
     color: #777;
     padding: 0 30px;
     margin: 15px 0 25px;
     text-transform: uppercase;
     display: block;
}

.about ul.nav.nav-tabs li:first-child>a {
     padding-left: 0;
     border-left: 0;
}

.about ul.nav.nav-tabs li>a {
     border-left: 1px solid #ddd;
     line-height: 14px;
}

.about ul.nav.nav-tabs li a.active {
     font-weight: 600;
}

.tab-content .tab-pane.fade.in {
     opacity: 1;
}

.custom-button {
     padding: 12px 50px;
     border-radius: 40px;
     font-size: 16px;
     font-weight: 600;
}

.fributton {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff !important;
    font-weight: 500 !important;
}
.spirtituality {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
     font-weight: 500 !important;
}
a.custom-button.peopleplatrom {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.bands {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.technlogy {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.publication {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.formation {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.global {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.voluteers {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.mission {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
a.custom-button.lovinaction {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-weight: 500 !important;
}
/*spirtituality ---------------------------------------- */



h4.pillers {
font-size: 2.3rem;
    font-weight: 400;
    margin: 2rem 0px 0px 0px;
    line-height: 2.2rem;
    
        text-transform: capitalize;
}

p.youth {
     font-size: 1.5rem;
     font-weight: 400;
}

.f-playfare {
     font-family: 'Playfair Display', serif !important;
     font-style: italic;
     font-size: 1.2rem;
}

.projectmanager {
padding: 8rem 0px;
    background-image: url(../images/spirituality.jpg);
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-bottom: 8rem !important;
}

.itemfivebox {
/*     padding-top: 30px !important;
     padding-bottom: 30px !important;
*/     margin: 0 auto;
}

h4.pillers.mb30 {
    margin-bottom: 30px;
}

.itemfivebox {
     text-align: center;
}

.itemfivebox img {
     max-width: 100%;
     margin: 0 auto;
}

.downloadsection h2 {
     font-family: 'Playfair Display', serif;
     color: #161511;
     font-size: 1rem;
     text-transform: capitalize;
     font-style: italic;
     line-height: 1.4rem;
     margin-top: 11px;
     margin-bottom: 5px;
}

.downloadsection a {
     color: #ddbf65;
     font-family: 'Playfair Display', serif !important;
     text-transform: initial;
     font-style: italic;
     font-size: 1rem;
     font-weight: 500;
}

.services {
     background-color: #efeade;
}


/* Pople ---------------------------------------- */

section#peopleplatforms {
     padding: 8rem 0px;
     background-image: url(../images/people.jpg);
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}

ul.fullylist li {
     width: 33%;
     display: inline-block;
     padding: 0px;
     float: left;
     font-size: 0;
     margin: 1px !important;
}

ul.fullylist {
     padding: 0px;
     list-style-type: none;
     width: 60%;
     margin: 2rem 20%;
     float: left;
     text-align: center;
}

ul.fullylist li a {
     background: rgba(54, 107, 151, 0.70);
     color: #fff;
     width: 100%;
     line-height: 57px;
     display: inline-block;
     text-transform: uppercase;
     font-size: 1rem;
     font-weight: 100;
}

ul.fullylist li a:hover {
     background: rgba(54, 107, 151, 0.80);
}


/* bands ---------------------------------------- */

section#bands {
     padding: 8rem 0px;
     background-image: url(../images/bands.jpg);
     background-attachment: fixed;
     background-position: bottom center;
     background-repeat: no-repeat;
     background-size: cover;
     padding-bottom: 4rem !important;
}

.bandlogos div {
     margin-bottom: 30px;
}

.logopads div {
     padding: 25px;
}

.bandlogos div img {
     text-align: center;
     width: 100%;
}

section.bandservices {
     background: #f6ceb8;
}

h2.textify {
     font-style: inherit !important;
}

.downloadsection p {
     color: #382c25 !important;
     line-height: 1.2rem !important;
     font-family: 'Playfair Display', serif !important;
     font-style: italic;
}


/* volunteership ---------------------------------------- */

section#volunteership {
     padding: 8rem 0px;
     background-image: url(../images/voluenteer.jpg);
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
     padding-bottom: 4rem !important;
}


/* Technlogoy ---------------------------------------- */

section#technology {
     padding: 8rem 0px;
     background-image: url(../images/technology.jpg);
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}

.poptech {
     text-align: center;
     padding: 30px 20px;
}

.poptech p {
     line-height: 1.3rem !important;
     font-family: 'Playfair Display', serif !important;
     font-style: italic;
     font-size: 1rem;
}

.poptech img {
     margin-bottom: 10px;
}

.poptech img {
     width: 100%;
}


/* Publications ---------------------------------------- */

section#publication {
     padding: 8rem 0px;
     background-image: url(../images/publication.jpg);
     background-attachment: fixed;
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}

.poptech h6 {
     margin-bottom: 4px;
     font-weight: bold;
}



/* formation ---------------------------------------- */

section#formation {
     padding: 8rem 0px;
     background: url("../images/formation.jpg");
     background-attachment: ;
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
     padding-bottom: 4rem !important;
}

.diployimage img {
     width: 100%;
}



/* globalpresence ---------------------------------------- */

section#globalpresence {
     padding: 6rem 0px;
     background: url("../images/global_presence.jpg");
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}


form {
    margin-left: -20px;
    margin-right: -20px;
}
/* Mission ---------------------------------------- */


section#mission {
     padding: 6rem 0px;
     background: url("../images/mission.jpg");
     background-attachment: fixed;
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
     padding-bottom: 0rem !important;
}
h2.normlfont {
    font-style: inherit;
    font-size: 1.1rem;
    line-height: 2rem;
    margin-top: 0px !important;
}

.missioncontent {
    background: rgba(0, 0, 0, 0.60);
    color: #fff !important;
    margin-top: 6rem !important;
}
.latest-post.text-center {
    padding: 1.5rem 0px;
}
.latest-post.text-center p {
    margin-bottom: 0px;
    padding: 0px 12px;
}
h2.white {
     color: #fff !important;
     font-weight: 400 !important;
}

section#jyjourney {
     padding: 8rem 0px;
     background: url(../images/publication.jpg);
     background-attachment: fixed;
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}
section#milestone {
    padding: 8rem 0px;
    background: url(../images/journey_bg.jpg);
    background-attachment: fixed;
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}


/* loveinaction ---------------------------------------- */

section#loveinaction {
     padding: 8rem 0px;
     background: url("../images/loveinaction.jpg");
     /*background-attachment: fixed;*/
     background-position: top center;
     background-repeat: no-repeat;
     background-size: cover;
}



/* Facts ---------------------------------------- */

.facts {
     background: url("../img/sections/facts-bg.jpg");
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: auto 110%;
}

.fact-badges {
     margin-top: 65px;
     text-align: center;
}

.fact-badges h2 {
     margin-top: 20px;
}

.fact-badges h2 span {
     font-weight: bold;
     font-size: 48px;
}

.fact-badges h2 strong {
     font-weight: 800;
     padding-right: 3px;
}

.fact-badges .fa {
     font-size: 90px;
     color: #fff;
}

.facts .top-text h4 {
     margin: 15px 0 25px;
     font-weight: 400;
}

.facts h4 {
     margin: 25px 0;
     font-weight: 700;
}

.blog {
     background-color: #f7f7f7;
}
.mt0 {
 margin-top: 0px !important;
}
.extraborder {
    border: 7px solid #fff;
    box-shadow: 2px 2px 2px #e0e0e0;
}

/*** Latest Posts ***/

.latest-posts-content {
     margin-top: 30px;
}

.latest-post {
     position: relative;
}

.latest-post .post-title {
     font-size: 18px;
     position: relative;
     margin-top: 15px;
     margin-bottom: 9px;
}

.post-text p {
     color: #704c0d !important;
     font-family: 'Playfair Display', serif;
     font-style: italic;
     font-weight: 500;
     margin-bottom: 30px;
         line-height: 1.4;
}

.latest-post .post-title a {
     color: #000 !important;
     transition: .1s;
     font-size: 18px;
     line-height: 18px;
     font-weight: 500;
     text-decoration: none;
     transition: 0.2s;
     text-transform: capitalize;
}
.monthlyreflection {
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 25px;
    background: #fff;
}
.monthlyreflection h4.subheading {
    padding-top: 20px;
}
.latest-post a.img-thumb {
     position: relative;
     display: inline-block;
     max-width: 100%;
     /*overflow: hidden;*/
     border-radius: 4px;
    width: 170px;
    height: 170px;
}
a.btn.btn-primary.diwbk {
    float: left;
    width: 100%;
    text-align: center;
    line-height: 27px;
    margin-bottom: 20px;
}
.latest-post a.img-thumb img {
     -webkit-transition: all 0.5s ease;
     -moz-transition: all 0.5s ease;
     -o-transition: all 0.5s ease;
     transition: all 0.5s ease;
     border-radius: 50%;
     /*border: 3px solid #ddd;*/
}
.downloadsection h2 a {
  color: #704c0d;
}
.latest-post a.img-thumb:hover img {
     transform: scale(1.1) !important;
     -o-transform: scale(1.1) !important;
     -moz-transform: scale(1.1) !important;
     -webkit-transform: scale(1.1) !important;
     -ms-transform: scale(1.1) !important;
     opacity: 1 !important;
}
.blackletter {
      color: #000 !important;
}
.robotocustom {
    font-family: 'Roboto', sans-serif !important;
    color: #000 !important;
    padding: 0px !important;
    margin-bottom: -1px !important;
    font-weight: 500;
}
.latest-post .custom-button {
     border-radius: 40px;
     font-size: 14px;
     font-weight: 600;
}

.latest-post .custom-button:before {
     content: "\f061";
     margin-top: -10px;
}

.latest-post .post-date {
     width: 40px;
     height: 50px;
     position: absolute;
     top: 15px;
     right: 15px;
     text-align: center;
     padding-top: 3px;
     border-radius: 4px
}

.latest-post .post-date span {
     display: block;
     color: #fff;
}

.latest-post .post-date span:first-child {
     font-weight: 600;
     font-size: 16px;
     padding-top: 1px;
}

.latest-post .post-date span:nth-child(2) {
     font-size: 12px;
}

.latest-posts-content .mx-auto .custom-button {
     margin-top: 50px;
}

.custom-button.link-blog:before {
     content: "\f044";
}


/*** Blog Page ***/

body.blog-page article {
     margin-bottom: 60px;
}

body.blog-page figure {
     margin: 0;
}

body.blog-page figure a img {
     width: 100%;
     border-radius: 4px;
}

body.blog-page article h4 {
     color: #555;
     text-transform: uppercase;
     font-weight: 700;
     font-size: 28px;
     margin: 0 0 20px;
     line-height: 34px;
}

body.blog-page.grid-no-sidebar article h4 {
     font-size: 23px;
     line-height: 31px;
}

body.blog-page p.excerpt-blog,
body.blog-page p.content-article {
     margin: 22px 0;
}

body.blog-page article .custom-button {
     border-radius: 40px;
     font-size: 14px;
     font-weight: 600;
}

body.blog-page article .custom-button:before {
     content: "\f061";
     margin-top: -10px;
}

body.blog-page .meta {
     clear: both;
     padding: 10px 0;
     width: 100%;
     border-top: 1px solid #ddd;
     border-bottom: 1px solid #ddd;
     font-size: 13px;
     margin-top: 30px;
}

body.blog-page .banner-area .meta {
     border-top: 0;
     border-bottom: 0;
}

body.blog-page .meta span {
     margin-right: 15px;
     display: inline-block;
}

body.blog-page .meta span i {
     padding-right: 4px;
}


/* Pagination */

body.blog-page .pagination {
     justify-content: center;
}

body.blog-page .pagination li:first-child a {
     border-top-left-radius: 4px;
     border-bottom-left-radius: 4px;
}

body.blog-page .pagination li:last-child a {
     border-top-right-radius: 4px;
     border-bottom-right-radius: 4px;
}

body.blog-page .pagination li a:hover {
     background: #ddd;
}

body.blog-page .pagination li a {
     background: transparent;
     border: 1px solid #ddd;
     border-radius: 0;
     padding: 9px 16px;
     font-size: 15px;
}

body.blog-page .pagination li.active a {
     color: #fff;
}


/* Comments */

.comments-heading {
     margin: 40px 0 25px;
     text-transform: uppercase;
     color: #555;
}

.comments-list {
     list-style: none;
     margin: 0;
     padding: 20px 0;
}

.comments-list .comment {
     margin-bottom: 30px;
     background: #efefef;
     padding: 25px;
     border-radius: 7px;
}

.comments-list img.comment-avatar {
     width: 82px;
     height: 82px;
     border-radius: 100%;
     margin-right: 25px;
}

.comments-list .comment-body {
     margin-left: 110px;
}

.comments-list .comment-author {
     font-size: 16px;
     color: #555;
     font-weight: 500;
}

.comments-list .comment-content {
     font-size: 13px;
}

.comments-list .comment-date {
     font-size: 12px;
}

.comments-list .comment-content {
     margin: 15px 0;
}

.comments-list .comment-reply {
     text-transform: uppercase;
     font-weight: 600;
}

.comments-reply {
     list-style: none;
     margin: 0 0 0 96px;
}


/* Comments Form */

.comments-heading.add-comment {
     margin: 0 0 50px;
}

.comments-form {
     margin-bottom: 0;
}

.comments-form .title-normal {
     margin-top: 0;
     line-height: normal;
     margin-bottom: 25px;
}

.comments-form .form-group {
     margin-bottom: 30px;
}

.custom-form textarea {
     padding: 15px;
     height: 150px;
     box-shadow: none;
     border: 1px solid #ddd;
     background: #f2f2f2;
     transition: .2s;
}

.custom-form input[type=text],
.custom-form input[type=password],
.custom-form input[type=email] {
     box-shadow: none;
     height: 42px;
     padding-left: 15px;
     border: 1px solid #ddd;
     background: #f2f2f2;
     font-size: 13px;
     transition: .2s;
}

body.blog-page article .comments-form .custom-button:before {
     content: "\f075";
}

.custom-form input[type=text]:focus,
.custom-form input[type=text]:active,
.custom-form input[type=email]:focus,
.custom-form input[type=email]:active,
.custom-form input[type=password]:focus,
.custom-form input[type=password]:active,
.custom-form textarea:focus,
.custom-form textarea:active {
     border: 1px solid #ccc;
     box-shadow: none;
     background: #ece4e4;
}

.comments-form.custom-form .custom-button {
     margin-top: 0;
}


/*** Sidebar ***/

.sidebar .widget-title {
     font-size: 18px;
     font-weight: 600;
     position: relative;
     margin-bottom: 25px;
     margin-top: 0;
     line-height: normal;
     text-transform: uppercase;
     color: #333;
}

.widget {
     background: #efefef;
     padding: 30px;
     margin-bottom: 30px;
     border-radius: 7px;
}


/* Recent Posts Widget */

.widget.recent-posts ul li {
     border-bottom: 1px solid #ddd;
     padding: 20px 0;
}

.widget.recent-posts ul li:first-child {
     padding-top: 0;
}

.widget.recent-posts ul li:last-child {
     border: 0;
     border-bottom: 0 !important;
     padding-bottom: 0;
     margin-bottom: 0;
}

.widget.recent-posts .posts-thumb {}

.widget.recent-posts .posts-thumb img {
     margin-right: 15px;
     width: 90px;
     height: 70px;
     border-radius: 3px;
}

.widget.recent-posts .post-info .entry-title {
     font-size: 14px;
     font-weight: 600;
     line-height: 20px;
     margin: 0;
}

.widget.recent-posts .post-info .post-meta {
     margin-bottom: 0;
}

.widget.recent-posts .entry-title a {
     color: #777;
     font-weight: 600;
}

.widget.recent-posts .post-date {
     font-weight: 400;
     color: #999;
     text-transform: capitalize;
     font-size: 12px;
}


/* Navigation Widget */

.sidebar ul.nav-tabs {
     border: 0;
}

.sidebar ul.nav-tabs li a {
     color: #777;
     border-radius: 0;
     padding: 0;
     padding-left: 0;
     font-weight: 600;
     display: inline-block;
     border-left: 0;
     margin: 0;
     font-size: 13px;
     text-transform: uppercase;
}

.sidebar ul.nav-tabs li {
     line-height: normal;
     font-weight: 600;
     border-bottom: 1px solid #ddd;
     padding: 15px 0;
     float: none;
     text-align: left;
     width: 100%;
}

.sidebar ul.nav-tabs li:first-child {
     padding-top: 0;
}

.sidebar ul.nav-tabs li:last-child {
     border-bottom: 0;
}


/* Tags Widget */

.widget-tags ul>li {
     display: inline-block;
     margin: 6px 6px 6px 0;
}

.widget-tags ul>li a {
     color: #999;
     border: 1px solid #999;
     display: block;
     font-size: 13px;
     padding: 5px 15px;
     font-weight: 600;
     border-radius: 3px;
     transition: 0.1s;
}

.widget-tags ul>li a:hover {
     color: #fff;
}


/* Video Promotion ---------------------------------------- */

.videopromotion {
     color: #fff;
     background: url("../img/sections/video-bg.jpg");
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: auto 110%;
}

.videopromotion p {
     color: #fff;
}

.btn-wrapper {
     margin-top: 70px
}

.btn-wrapper a {
     border-radius: 50%;
     -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
     box-sizing: border-box;
     display: inline-block;
     height: 80px;
     position: relative;
     text-align: center;
     -moz-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
     -webkit-transition: all 0.3s ease;
     transition: all 0.3s ease;
     width: 80px;
     outline: none;
}

.btn-wrapper a:before {
     content: "\f04b";
     font-family: FontAwesome;
     font-size: 26px;
     left: 50%;
     line-height: 41px;
     margin-left: -7px;
     margin-top: -20px;
     position: absolute;
     top: 50%;
}

.btn-wrapper a:hover {
     border-width: 22px;
}

.btn-wrapper a:hover:before {
     color: #fff;
}


/* Contact ---------------------------------------- */

.contact {
     background-color: #efefef;
}

.contact .container:first-child {
     padding: 100px 15px 30px !important;
}


/* Google Map */

.gmap_container {
     overflow: hidden;
     height: 450px;
     width: 100%;
}

.contact #gmap_canvas {
     height: 450px;
     width: 100%;
}

.contact #gmap_canvas img {
     max-width: none!important;
     background: none!important;
}

.contact #gmap_canvas strong {
     line-height: 26px;
     font-weight: 700;
}

.info-map {
     position: relative;
     clear: both;
     margin-top: 7px;
}

.info-map-gmap {
     height: 450px;
}

.info-map-boxes {
     zoom: 1;
     position: relative;
     margin-top: -180px;
     margin-bottom: 44px;
     -webkit-transition: opacity 0.2s linear;
     transition: opacity 0.2s linear;
}

.info-map-boxes:before {
     content: "";
     display: table;
}

.info-map-boxes:after {
     content: "";
     display: table;
     clear: both;
}

.info-map-boxes-item {
     padding: 18px 20px 15px;
     width: 100%;
     border-radius: 7px;
     font-size: 14px;
     color: inherit;
     background: #fff;
     box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.03), 0 0 7px rgba(0, 0, 0, 0.15);
}

.info-map-boxes-item:before {
     float: right;
     margin: 0;
     padding: 10px 0 0 30px;
     font-size: 70px;
     background: #fff;
}

.info-map-boxes-item:hover,
.info-map-boxes-item:focus {
     text-decoration: none;
}

.info-map-boxes-item h1 {
     margin: 0;
     padding: 0 0 15px;
     border-bottom: 1px solid #eee;
     font-size: 17px;
     font-weight: bold;
     text-transform: uppercase;
     line-height: 20px;
}

.info-map-boxes-item p {
     margin: 11px 0 0;
     line-height: 25px;
     font-size: 13px;
}


/* Contact Form */

.contactform {
     color: #fff;
     background: url("../img/sections/contactform-bg.jpg");
     background-attachment: fixed;
     background-position: center;
     background-repeat: no-repeat;
     background-size: auto 110%;
}

.contactform .form-container {
     max-width: 750px;
     margin: 0 auto;
     padding: 60px 0 30px;
}

.custom-form-group {
     margin-bottom: 20px;
}

.custom-form-group .input-group .input-group-addon {
     padding: 0px 13px;
     font-size: 18px;
     border: none;
     color: white;
}

.form-inputs .form-control {
     height: 40px;
}

.form-inputs .form-control {
     background: #fff;
     border-radius: 30px;
     box-shadow: none;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}

.custom-form-group textarea {
     width: 100%;
     padding: 20px 0 0 25px;
}

.form-group textarea:focus,
.form-group .form-control:focus {
     outline: 0px !important;
     -webkit-appearance: none;
}

.submit-form button {
     padding: 14px 26px;
     border-radius: 40px;
     display: block;
     font-weight: 600;
     margin: 0 auto;
     width: 100%;
     outline: none;
}

.submit-form button:before {
     right: 92px;
}

.contactform .output_message {
     padding: 8px;
     margin-bottom: 17px;
     border-radius: 2px;
     color: #fff;
     border-radius: 40px;
     font-weight: 600;
     text-transform: uppercase;
     font-size: 16px;
}

.contactform .output_message.success {
     background: #28a745;
     padding: 15px;
}

.contactform .output_message.success:before {
     font-family: FontAwesome;
     content: "\f14a";
     padding-right: 10px;
}

.contactform .output_message.error {
     background: #dc3545;
     padding: 15px;
}

.contactform .output_message.error:before {
     font-family: FontAwesome;
     content: "\f071";
     padding-right: 10px;
}


/* Logos Slider */

.logos {
     background-color: #fff;
}

.bx-wrapper {
     margin: 70px 0 70px;
}

ul.bxslider img {
     opacity: 0.7;
}


/* Banner */

.banner {
     background-image: url('../img/banner.jpg');
     background-repeat: no-repeat;
     background-position: center top;
     background-attachment: fixed;
}

.banner.banner-blog-post {
background-size: cover;
    background-position: center center;
        background-attachment: inherit;
}

.blog-page .banner-blog-post .meta span {
     color: #ccc
}

.blog-page .banner-blog-post .meta,
body.dark.blog-page .banner-blog-post .meta {
     border-top: 0;
     border-bottom: 0;
}

.banner .content {
     background-color: rgba(0, 0, 0, 0.55);
     padding: 125px 0 100px 0;
     width: 100%;
}

.banner .content h1,
.banner .breadcrumb>li {
     color: #fff !important;
}

.banner .breadcrumb {
     background: transparent;
     justify-content: center;
     text-transform: uppercase;
}

.banner .breadcrumb>li a {
     color: #fff;
     font-weight: 700;
}

.banner .breadcrumb>li+li:before {
     padding: 0 5px;
     color: #fff;
     content: "/\00a0";
}

.banner hr {
     width: 80px;
     margin-top: 32px;
     margin-bottom: 22px;
}


/* Social media */

label {
     display: inline-block;
     margin-bottom: .5rem;
     float: left;
     width: 100%;
     text-align: left;
     padding-left: 2rem;
     text-transform: capitalize;
     font-family: 'Playfair Display', serif !important;
     font-size: 16px;
     font-style: italic;
}

.social-icons ul {
     margin: 0;
     padding: 0;
     line-height: 0;
     font-size: 0;
}

.social-icons ul li {
     display: inline-block;
     margin: 0 20px 15px 0;
     padding: 0;
     vertical-align: top;
     list-style: none;
}

.social-icons ul li a {
     background: transparent;
     display: block;
     width: 63px;
     height: 63px;
     line-height: 59px;
     border-radius: 50%;
     -webkit-transition: 0.8s;
     transition: 0.8s;
     text-align: center;
     text-decoration: none;
     color: #fff !important;
}

.social-icons ul li a:hover {
     -webkit-transition: 0.4s;
     transition: 0.4s;
     color: #fff !important;
}

.social-icons ul li a:hover:before {
     transform: rotateY(360deg);
     -webkit-transform: rotateY(360deg);
     -webkit-transition: 0.4s;
     transition: 0.4s;
     color: #fff !important;
}

.social-icons ul li a:before {
     display: block;
     -webkit-transition: 0.8s;
     transition: 0.8s;
     font-family: FontAwesome;
     font-size: 30px;
     text-align: center;
}

.social-icons ul li a[title="facebook"]:before {
     content: "\f09a";
}

.social-icons ul li a[title="twitter"]:before {
     content: "\f099";
}

.social-icons ul li a[title="google"]:before {
     content: "\f0d5";
}

.social-icons ul li a[title="skype"]:before {
     content: "\f17e";
}

.social-icons ul li a[title="instagram"]:before {
     content: "\f16d";
}

.social-icons ul li a[title="linkedin"]:before {
     content: "\f0e1";
}

.social-icons ul li a[title="instagram"]:before {
     content: "\f16d";
}

.social-icons ul li a[title="youtube"]:before {
     content: "\f167";
}


/* Back To Top ---------------------------------------- */

#back-top {
     display: none;
}

#back-top-wrapper {
     position: fixed;
     right: 26px;
     bottom: 26px;
     overflow: hidden;
     z-index: 1111;
}

#back-top a {
     display: block;
     background-color: transparent;
     text-align: center;
     text-decoration: none;
     -webkit-transition: 1s;
     transition: 1s;
     width: 45px;
     margin: 0 auto;
     border-radius: 50%;
}

#back-top a:hover span:before {
     top: -50px;
}

#back-top a:hover span:after {
     top: 0;
}

#back-top a:hover span {
     background: none;
}

#back-top span {
     display: block;
     -webkit-transition: 1s;
     transition: 1s;
     z-index: 1;
     margin-bottom: 0;
     width: 41px;
     height: 41px;
     background: none;
     position: relative;
     overflow: hidden;
}

#back-top span:before,
#back-top span:after {
content: "";
    /* font-size: 19px; */
    /* font-family: FontAwesome; */
    background-image: url(../images/arrow.png);
    background-position: center center;
    background-repeat: no-repeat;
    position: absolute;
    left: 0;
    width: 41px;
    text-align: center;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    height: 41px;
}

#back-top span:before {
     top: 0;
}

#back-top span:after {
     top: 50px;
     color: #fff;
}
#back-top a:hover {
     background: transparent !important;
}


/* Inputs */

.input {
     position: relative;
     z-index: 1;
     display: inline-block;
}

.input-field {
     position: relative;
     display: block;
     float: right;
     padding: 0.8em;
     width: 60%;
     border: none;
     border-radius: 0;
     background: #f0f0f0;
     color: #aaa;
     -webkit-appearance: none;
}

.input-field:focus {
     outline: none;
}

.input-label {
     display: inline-block;
     float: right;
     padding: 0 1em;
     width: 40%;
     color: #6a7989;
     font-weight: bold;
     font-size: 70.25%;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     -webkit-touch-callout: none;
     -webkit-user-select: none;
     -moz-user-select: none;
     -ms-user-select: none;
     user-select: none;
}

.custom-input {
     overflow: hidden;
     border-radius: 30px;
     width: 100%;
}

.custom-input-field {
     border-radius: 4px;
     padding: 20px 35px;
     width: 100%;
     background: #232323;
     height: 55px;
     border-radius: 4px;
     border: none;
     outline: none;
     color: #fff;
}

.buttonwrapper .submit {
     position: absolute;
     right: 8px;
     top: 8px;
     background: #8f845d;
     width: 120px;
     height: 40px;
     border: none;
     outline: none;
     color: #161125;
     text-align: center;
     border-radius: 20px;
     cursor: pointer;
     z-index: 1;
}

footer h4 {
     font-size: 16px;
     text-align: left;
     margin-bottom: 20px;
}

.itemfivebox ul {
     padding: 0px;
     margin: 0px;
     list-style-type: none;
     text-align: left;
     margin-bottom: 30px;
}

.copyright {
    padding-top: 30px;
    background: #0e0e0e;
    text-align: center;
    padding-bottom: 25px;
}
.pt50 {
     padding-top:80px !important;
}
footer .itemfivebox {
     padding: 0px !important;
}

.mrginall {
     padding: 0px 0px 30px 0px;
}

.itemfivebox ul li a {
     color: #dac89d !important;
     font-family: 'Playfair Display', serif !important;
     font-style: italic;
     font-size: 15px;
}

.itemfivebox ul li a:hover {
     color: #fff !important;
}

.buttonwrapper .submit:hover {
     background: #8f845d;
     color: #fff;
}

.buttonwrapper {
     position: relative;
}

.custom-input-field:focus {
     outline: 0px !important;
     -webkit-appearance: none;
}

.custom-input-field:focus .custom-input {
     background: blue;
}

.custom-input-label {
     position: absolute;
     padding: 14px;
     width: 52px;
     height: 50px;
}

.contactform textarea {
     color: #aaa;
     border-radius: 30px;
     box-shadow: none;
     -webkit-transition: 0.3s;
     transition: 0.3s;
}

.custom-input-label::before {
     content: "";
     position: absolute;
     top: 0;
     left: 0;
     z-index: -1;
     width: 50px;
     height: 50px;
     -webkit-transform-origin: 0% 50%;
     transform-origin: 0% 50%;
     -webkit-transition: -webkit-transform 0.3s;
     transition: -webkit-transform 0.3s;
     transition: transform 0.3s;
     transition: transform 0.3s, -webkit-transform 0.3s;
}

.icon-field {
     color: #fff;
     -webkit-transform: scale3d(1, 1, 1);
     transform: scale3d(1, 1, 1);
     -webkit-transform-origin: 0% 50%;
     transform-origin: 0% 50%;
     -webkit-transition: -webkit-transform 0.3s;
     transition: -webkit-transform 0.3s;
     transition: transform 0.3s;
     transition: transform 0.3s, -webkit-transform 0.3s;
     margin: 0 auto;
     display: block;
     text-align: center;
     font-size: 20px;
     margin: 0;
}

.custom-input-field:focus {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
}

.custom-input-field:focus+.custom-input-label::before {
     -webkit-transform: scale3d(0.8, 1, 1);
     transform: scale3d(0.8, 1, 1);
}

.custom-input-field:focus+.custom-input-label .icon-field {
     -webkit-transform: scale3d(0.6, 0.6, 1);
     transform: scale3d(0.6, 0.6, 1);
}


/* [ FOOTER ] */


/*================================================== */

.footer {
     padding: 40px 0;
     background-color: #111;
}

.footer .container {
     padding: 30px 0px 0px 0;
}

.footer,
.footer a,
.footer p {
     color: #fff;
     padding-bottom: 10px;
}

.footer .container p:first-child {
    font-weight: 500;
    text-transform: initial !important;
}
img.footerlogo {
    width: 300px;
}
.footer .social-icons ul li a {
     width: 42px;
     height: 42px;
     line-height: 43px;
     background: #464646;
}

.footer .social-icons ul li a:before {
     font-size: 21px;
}


/* Responsive Design Styles ---------------------------------------- */


/* Large Devices */

@media (max-width: 1199px) and (min-width: 992px) {
     .about ul.nav.nav-tabs li a,
     .about ul.nav.nav-tabs li a.active {
          padding: 0 15px;
     }
     .about ul.nav.nav-tabs li:first-child a {
          padding-left: 0;
     }
     .about ul.nav.nav-tabs li:last-child a {
          padding-right: 0;
     }
}

@media (max-width: 1199px) {
     .projectmanager {
          text-align: center;
     }
     .projectmanager .img-fluid {
          float: none;
          margin: 0 auto 50px;
     }
}


/* Small Devices */

@media (max-width: 991px) {
     body.dark .nav-menu ul.nav-menu-inner li a,
     body.dark .header-fixed .nav-menu ul.nav-menu-inner li a {
          border-top: 1px solid #343434;
     }
     body.dark .nav-menu ul.nav-menu-inner li:last-child a,
     body.dark .header-fixed .nav-menu ul.nav-menu-inner li:last-child a {
          border-bottom: 1px solid #343434;
     }
     body.dark .nav-menu ul.nav-menu-inner li:first-child a {
          border-top: 0 !important;
     }
     .projectmanager {
          text-align: center;
     }
     .projectmanager .img-fluid {
          float: none;
          margin: 0 auto 50px;
     }
     .about .about-content .title-about {
          margin-top: 0;
     }
     .about .about-right-side {
          margin-top: 82px;
     }
     .about .about-right {
          margin-left: -22px;
     }
     .services .services-box {
          margin: 30px -9px;
     }
     .services .services-box-item-cover,
     .services .services-box-item-content {
          transform: none;
          transition: none;
     }
     .services .services-box-item-content {
          padding: 15px;
     }
     .services .services-box-item-cover {
          display: none;
     }
     .services .services-box-item {
          margin: 28px 0;
     }
     .team-member {
          margin-top: 20px;
     }
     .newsletter form .custom-button {
          position: relative;
          margin-top: 20px;
          width: 100%;
     }
     .newsletter form .form-group input {
          padding-right: 0;
     }
     .submit-form button:before {
          right: 260px;
     }
     .blog .blog-content .blog-excerpt .meta {
          margin-bottom: 40px;
     }
     .blog-page .sidebar .widget.recent-posts ul li {
          display: block;
          clear: both;
     }
     .blog .blog-content .custom-button {
          margin-top: 0;
     }
     .custom-button:before {
          display: none !important;
     }
     .custom-button span {
          transform: none !important;
     }
     .nav-menu ul.nav-menu-inner li {
          display: block;
          width: 100%;
     }
}


/* Extra Small Devices */

@media (max-width: 767px) {
     .about .container,
     .services .container,
     .portfolio .container,
     .team .container,
     body.big-triangle .team .container,
     .blog .container,
     .contact .container {
          padding-left: 15px !important;
          padding-right: 15px !important;
     }
     .header-inner,
     .videopromotion p,
     .newsletter p,
     .logos .container,
     .footer .social-icons {
          padding-left: 15px;
          padding-right: 15px;
     }
     body.blog-page .pagination {
          margin-bottom: 65px;
     }
     .about ul.nav.nav-tabs li a,
     .about ul.nav.nav-tabs li a.active {
          padding: 0 20px;
     }
     .about ul.nav.nav-tabs li:first-child a {
          padding-left: 0;
     }
     .about ul.nav.nav-tabs li:last-child a {
          padding-right: 0;
     }
     h1 {
          font-size: 40px;
          line-height: 40px;
     }
     h2 {
          font-size: 32px;
     }
     h4 {
          font-size: 18px;
     }
     .header {
          height: 65px;
     }
     .header .logo a {
          width: 220px;
          margin-top: 20px;
          margin-bottom: 25px;
          transition: all 0.3s ease 0s;
          -o-transition: all 0.3s ease 0s;
          -moz-transition: all 0.3s ease 0s;
          -webkit-transition: all 0.3s ease 0s;
     }
     .top-text h1,
     .top-text h4,
     .footer p {
          margin-left: 15px;
          margin-right: 15px;
     }
     .top-text h4 {
          line-height: 28px;
     }
     .about .about-content .about-left-side {
          margin-top: 0;
     }
     .latest-posts-content>div {
          margin-bottom: 0px;
     }
     .projectmanager .img-fluid {
          float: none;
          margin: 0 auto 50px;
     }
     .projectmanager ul,
     .projectmanager li {
          margin-top: 15px;
     }
     .portfolio .nav-pills li {
          margin: 0 10px 10px 0;
     }
     .testimonials #quote-carousel blockquote {
          padding: 0 15px;
     }
     .team-member {
          max-width: 480px;
          margin: 0 auto;
          display: block;
          margin-bottom: 25px;
     }
     .newsletter .custom-form-group {
          padding: 0;
     }
     .info-map-gmap {
          height: 300px;
     }
     .info-map-boxes-item {
          width: 100%;
          margin-top: 30px;
     }
     .info-map-boxes,
     body.double-diagonal .info-map-boxes,
     body.reversed-skew .info-map-boxes,
     body.skew .info-map-boxes {
          margin-top: 0px;
     }
     body.reversed-skew .info-map-boxes,
     body.skew .info-map-boxes {
          padding-bottom: 70px;
     }
     .footer li a {
          font-size: 23px;
     }
     .social-icons ul li a {
          width: 43px;
          height: 43px;
          line-height: 40px;
     }
     .social-icons ul li a:before {
          font-size: 21px;
     }
     .submit-form button {
          width: 100%;
     }
     .submit-form button:before {
          right: 42px;
     }
     .blog-page .blog-content span.permalink {
          float: none;
     }
     .blog-page article figure {
          max-width: 100%;
          margin-right: 0px;
          margin-bottom: 20px;
     }
     .blog-post .add-comment .form-holder form input,
     .blog-post .add-comment .form-holder form textarea {
          width: 100%;
     }
     .output_message_holder {
          margin-top: 30px;
     }
}

@media (max-width: 576px) {
     .portfolio .filtr-item {
          padding-left: 0;
          padding-right: 0;
     }
     .about ul.nav.nav-tabs {
          border: 1px solid #ddd;
          border-radius: 7px;
     }
     .about ul.nav.nav-tabs li a {
          border-left: 0;
          margin: 0;
          padding: 15px 0;
     }
     body.dark .about ul.nav.nav-tabs li>a {
          border-left: 0;
     }
     .about ul.nav.nav-tabs li a.active {
          color: #fff;
          margin: 0;
          padding: 15px 0;
     }
     .about ul.nav.nav-tabs li:first-child a {
          border-top-left-radius: 7px;
          border-top-right-radius: 7px;
     }
     .about ul.nav.nav-tabs li:last-child a {
          border-bottom-left-radius: 7px;
          border-bottom-right-radius: 7px;
     }
     .nav-tabs>li {
          float: none;
          width: 100%;
          text-align: center;
          border-bottom: 1px solid #ddd;
     }
     body.dark .nav-tabs>li {
          border-bottom: 1px solid #343434;
     }
     body.dark .about ul.nav.nav-tabs {
          border: 1px solid #343434;
     }
     .nav-tabs>li:last-child,
     body.dark .nav-tabs>li:last-child,
     body.dark .sidebar ul.nav-tabs>li:last-child {
          border-bottom: 0;
     }
     .nav-tabs>li a.active {
          border-bottom: 0;
     }
     .about .tab-content p {
          margin-top: 20px;
     }
     body.double-diagonal .portfolio .container,
     body.normal .portfolio .container,
     body.reversed-skew .portfolio .container,
     body.big-triangle .portfolio .container,
     body.skew .portfolio .container {
          padding-right: 15px !important;
          padding-left: 15px !important;
     }
     .services .services-box-item {
          margin-top: 15px;
          padding: 0 15px;
     }
}

.textbanner {
     position: relative;
     width: 55% !important;
     margin: 0 auto !important;
     float: none !important;
     letter-spacing: 0px !important;
     font-weight: 300 !important;
}

header#header {
background: rgb(0, 0, 0);
}

.header .nav-menu ul.nav-menu-inner li a.current:after {
     position: absolute;
     content: "";
     left: 0;
     right: 0;
     bottom: 24px;
     height: 1px;
     width: 80%;
     background: #7e6d44;
     margin: 0 auto;
}

.header-fixed .nav-menu ul.nav-menu-inner li a.current:after {
     bottom: 16px;
}

.header .nav-menu ul.nav-menu-inner li a.current {
     position: relative;
}

section#jesusyouths {
     background: #efeade;
}

h2.mainhead {
     color: rgba(255, 255, 255, 1.00);
     font-family: 'NavithScriptDemo';
     font-weight: normal !important;
     font-style: normal;
     text-decoration: none;
     text-transform: inherit;
     padding-bottom: 4rem;
}

.all80 {
     float: none;
     margin: 0 auto;
     width: 80%;
     font-size: 1.3rem;
     font-weight: 300;
     line-height: 1.7rem;
     padding-bottom: 2rem;
}

.graycolor {
     color: #8c794b !important;
     font-weight: 500 !important;
     font-size: 1.3rem !important;
     width: 49% !important;
}

ul.textinline li a {
     color: #fff;
     padding: 0px 1.2rem;
     font-size: 1.1rem;
     border-right: 1px solid #fff;
     line-height: 1;
     cursor: pointer;
}

ul.textinline li a:hover {
     color: #8c794b !important;
}

ul.textinline li {
     display: inline;
}

ul.textinline {
     padding: 0px;
     margin: 3.5rem 0px;
     list-style-type: none;
     text-transform: uppercase;
}

ul.textinline li:last-child a {
     border-right: 0px !important;
}

ul.textinline li a:hover {
     color: #ddbf65;
}

section {
     display: flow-root !important;
}


@media (max-width: 99999px) and (min-width: 928px) {
span.fmobile {
    display: none;
}
     .bigcontent {
font-size: 40px !important;
    line-height: 42px !important;
    font-weight: 400!important;
    margin-bottom: 24px !important;
}


     div#rev_slider_forcefullwidth {
          height: 700px !important;
     }
     .rev_slider {
          height: 700px !important;
     }
     .textbanner {
          width: 57% !important;
          font-size: 1.2rem !important;
          line-height: 1.6rem !important;
     }
     h2.mainhead {
          font-size: 9rem;
          padding-top: 50px !important;
     }
     .itemfivebox {
          width: calc(100% / 5);
     }
     .itemfivebox.four {
          width: calc(100% / 4) !important;
     }
     .container-fluid {
          width: 96% !important;
     }
     a.nav-brand img {
          height: 40px;
     }
     .nav-menu>li>a {
          padding: 26px 14px;
     }
     .modal-dialog.modal-lg.customizewidth {
          width: 65% !important;
          max-width: 100% !important;
     }
     .col7 {
          float: left;
          width: calc(100% / 7);
          padding: 1px 5px;
     }
}

@media (max-width: 998px) and (min-width: 768px) {

     .bigcontent {
    font-size: 1.8rem !important;
    line-height: 2rem !important;
    font-weight: 400!important;
    margin-bottom: 24px !important;
}

     .modal-dialog.modal-lg.customizewidth {
          width: 65% !important;
          max-width: 100% !important;
     }
     .navigation-portrait .nav-menu>li>a {
          color: #000 !important;
     }
     div#rev_slider_forcefullwidth {
          height: 700px !important;
     }
     .rev_slider {
          height: 700px !important;
     }
     .textbanner {
          width: 80% !important;
          font-size: 1rem !important;
          line-height: 1.5rem !important;
          padding-top: 25px !important;
     }
     .nav-menu>li>a {
          padding: 26px 8px;
     }
     h2.mainhead {
          font-size: 8rem;
          padding-top: 50px !important;
     }
     p.all80 {
          width: 85%;
          font-size: 1rem;
     }
     .itemfivebox {
          width: calc(100% / 5);
     }
     .itemfivebox.four {
          width: calc(100% / 4) !important;
     }
     ul.fullylist {
          width: 80%;
     }
     .col7 {
          float: left;
          width: calc(100% / 4);
          padding: 15px 5px;
     }
     span.fmobile {
    display: none;
}
}

@media (max-width: 768px) and (min-width: 100px) {
     span.mMobito {
    display: none;
}
.copyright.col-md-12 p {
    font-size: 13px !important;
}

ul.footerlocation li {
    font-size: 13px !important;
    margin: 10px 10px !important;
}
ul.footerlocation li a {
    font-size: 16px !important;
}

     .poptech img {
    width: 70% !important;
}

     .bigcontent {
font-size: 20px !important;
    line-height: 25px!important;
    font-weight: 400!important;
    margin-bottom: 24px !important;
}


     form {
padding: 0px 20px 0px 10px !important;
}
     .col7 {
          float: left;
          width: calc(100% / 2);
          padding: 15px 5px;
     }
     .navigation-portrait .nav-menu>li>a {
          color: #000 !important;
     }
     .logopreloader {
          width: 80%;
          margin: 0 auto !important;
          float: none;
     }
     .logopreloader img {
        width: 80px;
     }
     div#rev_slider_forcefullwidth {
          height: 500px !important;
     }
     .bandlogos div img {
    width: 70% !important;
}
     .latest-post.text-center {
    padding: 1rem 0px !important;
}
     footer .itemfivebox {
          padding-left: 3% !important;
          width: 50% !important;
     }
     .footer .container {
    padding: 30px 15px 0px 30px !important;
}
     h4.pillers {
          font-size: 2rem !important;
     }
     footer img {
          width: 77%;
     }
     .header .nav-menu ul.nav-menu-inner li a.current:after {
          display: none !important;
     }
     .header .nav-menu ul.nav-menu-inner li a.current {
          color: #f0df80 !important;
     }
     .rev_slider {
          height: 500px !important;
     }
     .textbanner {
          width: 100% !important;
          font-size: 15px !important;
          line-height: 1.3rem !important;
          padding-top: 50% !important;
     }
/*     .latest-post a.img-thumb img {
          width: 130px;
     }*/
     h2.mainhead {
    font-size: 5rem;
    line-height: 4rem;
     }
     p.all80 {
          width: 100%;
          font-size: 1rem;
     }
     .graycolor {
          width: 100% !important;
          font-weight: 400 !important;
          font-size: 1.2rem !important;
     }
     h2.mainhead {
          padding-bottom: 2rem !important;
     }
     ul.textinline {
          float: left;
          width: 100%;
          margin: 0px !important;
     }
     ul.textinline li {
          width: 100%;
          float: left;
          line-height: 32px;
     }
     ul.textinline li a {
          border: none !important;
          . font-size: 1rem !important;
     }
     .itemfivebox {
          width: calc(100% / 1);
     }
     .itemfivebox.four {
          width: calc(100% / 1) !important;
     }
     ul.fullylist li {
          width: 100%;
     }
     ul.fullylist {
          margin: 1rem auto !important;
          width: 90%;
     }
}


/* Body Styles */

header {
     min-height: 70px;
}


/* Navigation Styles */

nav {
     position: relative;
     width: 100%;
}

ul.main-nav {
     list-style-type: none;
     padding: 0px;
     font-size: 0px;
     max-width: 100%;
     margin: 0 auto;
}

ul.main-nav>li {
     display: inline-block;
     padding: 0;
     cursor: pointer;
     margin-right: 1px;
}

ul.main-nav>li>a {
     display: block;
     padding: 24px 1rem;
     position: relative;
     color: #fff;
     font-size: 13px;
     font-weight: 400;
     box-sizing: border-box;
     text-transform: uppercase;
}

ul.main-nav>li:hover {
     background: rgb(89, 76, 46);
}

ul.main-nav>li:hover>a {
     color: #fff;
}

ul.main-nav>li ul.sub-menu-lists {
     margin: 0px;
     padding: 0px;
     list-style-type: none;
     display: block;
}

ul.main-nav>li ul.sub-menu-lists>li {
     padding: 2px 0;
}

ul.main-nav>li ul.sub-menu-lists>li>a {
     font-size: 14px;
}

.ic {
     position: fixed;
     cursor: pointer;
     display: inline-block;
     right: 15px;
     width: 32px;
     height: 24px;
     text-align: center;
     top: 0px;
     outline: none;
}

.ic.close {
     opacity: 0;
     font-size: 0px;
     font-weight: 300;
     color: #fff;
     top: 8px;
     height: 40px;
     display: block;
     outline: none;
}

ul.main-nav {
     width: 100%;
     float: right;
     text-align: right;
}


/* Menu Icons for Devices*/

.ic.menu {
    top: 23px;
    z-index: 9999999999 !important;
}

.ic.menu .line {
     height: 4px;
     width: 100%;
     display: block;
     margin-bottom: 6px;
}

.ic.menu .line-last-child {
     margin-bottom: 0px;
}

.sub-menu-head {
     margin: 10px 0;
}

.banners-area {
     margin-top: 20px;
     padding-top: 15px;
}

@media only screen and (max-width:768px) {
     .sub-menu-head {
          color: orange;
     }
     /*.ic.menu {
          display: block;
     }*/
     header.dark .ic.menu .line {
          background-color: #fff;
     }
     header.light .ic.menu .line {
          background-color: #fff;
     }
     .ic.menu .line {
          -webkit-transition: all 0.4s ease 0s;
          -o-transition: all 0.4s ease 0s;
          transition: all 0.4s ease 0s;
          -webkit-transform: rotate(0deg);
          -moz-transform: rotate(0deg);
          -ms-transform: rotate(0deg);
          transform: rotate(0deg);
          -webkit-transform-origin: center center;
          -ms-transform-origin: center center;
          transform-origin: center center;
          background: #fff !important;
     }
     .ic.menu:focus .line {
          background-color: #fff !important;
     }
     .ic.menu:focus .line:nth-child(1) {
          -webkit-transform: rotate(45deg);
          -moz-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
          transform: rotate(45deg);
     }
     .ic.menu:focus .line:nth-child(2) {
          -webkit-transform: rotate(-45deg);
          -moz-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
          margin-top: -10px;
     }
     .ic.menu:focus .line:nth-child(3) {
          transform: translateY(15px);
          opacity: 0;
     }
     .ic.menu:focus {
          outline: none;
     }
     .ic.menu:focus~.ic.close {
          opacity: 1;
          z-index: 21;
          outline: none;
     }
     /* .ic.menu:focus ~ .ic.close {
         opacity: 1.0;
         z-index : 21;
    }
     .ic.close:focus {
         opacity: 0;
    }
     */
     .ic.menu:focus {
          opacity: 1;
     }
     nav {
          background-color: transparent;
     }
     /* Main Menu for Handheld Devices */
     ul.main-nav {
          z-index: 2;
          padding: 50px 0;
          position: fixed;
          right: 0px;
          top: 0px;
          width: 0px;
          background-color: rgba(0, 0, 0, 1);
          height: 100%;
          overflow: auto;
          /*CSS animation applied : Slide from Right*/
          -webkit-transition-property: background, width;
          -moz-transition-property: background, width;
          -o-transition-property: background, width;
          transition-property: background, width;
          -webkit-transition-duration: 0.6s;
          -moz-transition-duration: 0.6s;
          -o-transition-duration: 0.6s;
          transition-duration: 0.6s;
     }
     .ic.menu:focus~.main-nav {
          width: 300px;
          background-color: rgba(0, 0, 0, 1);
     }
     ul.main-nav>* {
          -webkit-transition-property: opacity;
          -moz-transition-property: opacity;
          -o-transition-property: opacity;
          transition-property: opacity;
          -webkit-transition-duration: 0.4s;
          -moz-transition-duration: 0.4s;
          -o-transition-duration: 0.4s;
          transition-duration: 0.4s;
          opacity: 0;
     }
     .ic.menu:focus~.main-nav>* {
          opacity: 1;
     }
     ul.main-nav>li>a:after {
          display: none;
     }
     ul.main-nav>li:first-child {
          border-radius: 0px;
     }
     ul.main-nav>li {
          display: block;
          border-bottom: 1px solid #444;
     }
     .fullmenu a {
          float: left;
          width: 100%;
          line-height: 30px !important;
          margin-bottom: 0px !important;
     }
     .fullmenu img {
          float: left;
          width: 35px !important;
          margin-right: 15px;
     }
     .fullmenu span {
          float: left;
          padding: 0px !important;
          width: 62% !important;
          text-align: left;
     }
     .lineafter:before {
          display: none;
     }
     .lineafter:after {
          display: none;
     }
     .sub-menu-block {
          padding: 1rem 0px .8rem 2rem !important;
     }
     ul.main-nav>li>a {
          font-weight: 500;
          padding: 5px 20px !important;
          text-align: left;
     }
     ul.main-nav>li ul.sub-menu-lists>li a {
          color: #eee;
          font-size: 14px;
     }
     .sub-menu-head {
          font-size: 16px;
     }
     ul.main-nav>li:hover {
          background-color: transparent;
     }
     ul.main-nav>li:hover>a {
          color: #fff;
          text-decoration: none;
          font-weight: 600;
     }
     .ic.menu:focus~ul.main-nav>li>div.sub-menu-block {
          border-left: 0px solid #ccc;
          border-right: 0px solid #ccc;
          border-bottom: 0px solid #ccc;
          position: relative;
          visibility: visible;
          opacity: 1.0;
     }
     .sub-menu-block {
          padding: 0 30px;
     }
     .banners-area {
          padding-bottom: 0px;
     }
     .banners-area div {
          margin-bottom: 15px;
     }
     .banners-area {
          border-top: 1px solid #444;
     }
}

.sub-menu-block {
     text-align: center;
}

.fullmenu img {
     /*     background: #fff;
     border-radius: 50%;
     padding: 5px;
     width: 60px;*/
     width: 100px;
}

.fullmenu span {
     float: left;
     width: 100%;
     padding: 8px 0px;
     color: #fff;
     text-transform: uppercase;
     font-size: 13px;
}

.fullmenu a:hover img {
     opacity: .9;
}

.fullmenu a:hover span {
     color: #7e6d44;
}

.sub-menu-block {
     padding: .7rem 1rem;
}

.padding0 {
     padding: 0px !important;
}

.lineafter:after {
     height: 100%;
     width: 1px;
     content: "";
     background: rgba(255, 255, 255, 0.20);
     position: absolute;
     top: 0;
     right: 0;
}

.lineafter:before {
     height: 100%;
     width: 1px;
     content: "";
     background: rgba(255, 255, 255, 0.20);
     position: absolute;
     top: 0;
     left: 0;
}

.lineafter {
     position: relative;
}

ul.main-nav>li>a.current {
     background: rgb(89, 76, 46);
     color: #fff !important;
}

@media only screen and (min-width:769px) {
     .ic.menu {
          display: none;
     }
     /* Main Menu for Desktop Devices */
     ul.main-nav {
          display: block;
          position: relative;
     }
     /* Sub Menu */
     ul.main-nav>li>div.sub-menu-block {
          visibility: hidden;
          background: rgb(0, 0, 0);
          position: absolute;
          margin-top: 0px;
          width: 66%;
          color: #333;
          right: 0;
          box-sizing: border-box;
          z-index: 3;
          font-size: 16px;
          opacity: 0;
          /*CSS animation applied for sub menu : Slide from Top */
          -webkit-transition: all 0.4s ease 0s;
          -o-transition: all 0.4s ease 0s;
          transition: all 0.4s ease 0s;
          -webkit-transform: rotateX(90deg);
          -moz-transform: rotateX(90deg);
          -ms-transform: rotateX(90deg);
          transform: rotateX(90deg);
          -webkit-transform-origin: top center;
          -ms-transform-origin: top center;
          transform-origin: top center;
     }
     ul.main-nav>li:hover>div.sub-menu-block {
          background: rgb(0, 0, 0);
          visibility: visible;
          opacity: 1;
          -webkit-transform: rotateX(0deg);
          -moz-transform: rotateX(0deg);
          -ms-transform: rotateX(0deg);
          transform: rotateX(0deg);
     }
     ul.main-nav>li>div.sub-menu-block>* {
          -webkit-transition-property: opacity;
          -moz-transition-property: opacity;
          -o-transition-property: opacity;
          transition-property: opacity;
          -webkit-transition-duration: 0.4s;
          -moz-transition-duration: 0.4s;
          -o-transition-duration: 0.4s;
          transition-duration: 0.4s;
          opacity: 0;
     }
     ul.main-nav>li:hover>div.sub-menu-block>* {
          opacity: 1;
     }
     .sub-menu-head {
          font-size: 20px;
     }
     /* List Separator: Outer Border */
     header.dark ul.main-nav>li>a {
          border-right: 1px solid #bbb;
     }
     header.light ul.main-nav>li>a {
          border-right: 1px solid #666;
     }
     /* List Separator: Inner Border */
     ul.main-nav>li>a:after {
          content: '';
          width: 1px;
          height: 62px;
          position: absolute;
          right: 0px;
          top: 0px;
          z-index: 2;
     }
     header.dark ul.main-nav>li>a:after {
          background-color: #777;
     }
     header.light ul.main-nav>li>a:after {
          background-color: #999;
     }
     /* Drop Down/Up Arrow for Mega Menu */
     ul.main-nav>li>a.mega-menu>span {
          display: block;
          vertical-align: middle;
     }
     ul.main-nav>li>a.mega-menu>span:after {
          content: '';
          display: inline-block;
          margin-left: 10px;
          vertical-align: middle;
          height: 6px;
          width: 6px;
          border-style: solid;
          border-width: 0 1px 1px 0;
          border-color: transparent #fff #fff transparent;
          transform: rotate(45deg);
          transition: border 0.2s;
          margin-top: -5px;
     }
     ul.main-nav>li:hover>a.mega-menu span:after {
          content: '';
          display: inline-block;
          margin-left: 10px;
          vertical-align: middle;
          height: 6px;
          width: 6px;
          border-style: solid;
          border-width: 0 1px 1px 0;
          border-color: transparent #fff #fff transparent;
          transform: rotate(-135deg);
          transition: border 0.2s;
          margin-top: 5px;
     }
     .banners-area {
          border-top: 1px solid #ccc;
     }
}

.how-section1 {
     padding: 0px 4rem 4rem 4rem;
}

.how-section1 h4 {
     color: #ffa500;
     font-weight: bold;
     font-size: 30px;
}

.how-section1 .subheading {
     color: #947928;
     font-size: 20px;
     text-transform: uppercase;
     margin-bottom: 0px;
}

.how-section1 .row:after {
     position: absolute;
     content: "";
     width: 97%;
     height: 1px;
     bottom: -30px;
     left: 0;
     background: #bebebe;
     margin: 0 auto;
     right: 0;
}

.how-section1 .row:last-child:after {
     display: none;
}

.how-section1 .row {
     padding-top: 7.5%;
     position: relative;
}

.how-img {
     text-align: center;
}

.how-img img {
     width: 100%;
}

.text-muted {
     color: #363636 !important;
     font-size: 16px;
     line-height: .9 !important;
     text-align: center;
}

.customizewidth .close {
     position: absolute;
     right: -24px;
     top: -42px;
     z-index: 9;
     background: #8c794b;
     opacity: .999 !important;
     text-shadow: none;
     color: #fff;
     border-radius: 50%;
     width: 30px;
     height: 30px;
     margin-top: 3% !important;
     cursor: pointer;
}

img.img-responsive {
     width: 100%;
}

.fullfriendship .relecent {
     position: absolute;
     top: 32%;
     left: 0;
     right: 0;
     margin: 0 auto;
     float: none;
     text-align: center;
}

.fullfriendship {
     position: relative;
}

.modal-content {
     border: 0px !important;
}

div#friendshipdetails {
     background: rgba(0, 0, 0, 0.5);
}

.modal-dialog.modal-lg.customizewidth {
     border: 1px solid #555;
     border-radius: 5px;
}

.black {
     color: #333 !important;
}

.topaligndiv {
     background: #fff;
     position: relative;
     top: -50px;
     border-radius: 5px 5px 0px 0px;
     /*border: 1px solid #bebebe;*/
     bottom: 0px;
     margin-bottom: 0px;
     overflow: hidden;
}

.textcap {
     text-transform: capitalize !important;
}

.caption {
     padding: 20px 25px;
}

.mt20 {
     margin-top: 20px;
}

.mb20 {
     margin-bottom: 20px;
}

.backto {
     background: #039;
     padding: 12px 0;
     color: #fff
}

.backto a {
     color: #FFF;
     text-decoration: none
}

.cards-row {
     padding-top: 40px;
     padding-bottom: 20px;
     background: #eee
}

.thumbnail {
     padding: 0;
     border-radius: 0;
     border: 1px solid #ddd;
     min-height: 380px;
     margin-bottom: 30px;
}

.thumbnail>img {
     width: 140px;
     display: block;
     margin: 0 auto;
     margin-top: 20px;
     border-radius: 50%;
     border: 2px solid #ddd;
}

.thumbnail h3 {
     font-size: 17px;
     font-weight: bold;
     color: #333;
     text-transform: uppercase !important;
     color: #ddbf65 !important;
}

.thumbnail h3,
.card-description {
     margin: 0;
     padding: 0px 0px 15px 0;
     text-align: center;
     text-transform: inherit;
}

.thumbnail p {
     padding-top: 0px;
     font-size: 1rem;
     color: #333 !important;
     line-height: 1.5;
     text-align: justify;
     padding-bottom: 0px;
}
p.text-muted.all70 {
    font-weight: 400;
    font-size: 1.1rem !important;
    padding-bottom: 40px;
    width: 72%;
    margin: 0 auto;
        word-break: break-word;
}
.text-muted a {
    font-family: 'Playfair Display', serif !important;
    font-style: italic;
    color: #73643b !important;
    font-size: 100% !important;
}
@media (max-width: 90000px) and (min-width: 768px) {
     img.lefimg {
          float: left;
          width: 35%;
          margin: 0px 25px 20px 0px;
     }
     img.rightimage {
          float: right;
          width: 35%;
          margin: 0px 0px 20px 25px;
     }
     img.centerimage {
          width: 350px;
          margin: 0 auto;
          margin-bottom: 25px !important;
     }
     .timeline-centered {
    margin: 0px 80px;
}
h4.subheading.normalfont {
    font-size: 2rem;
    text-transform: inherit;
    font-weight: 400;
    margin-bottom: 30px !important;
    color: #000 !important;
    letter-spacing: -.5px;
}

}

@media (max-width: 768px) and (min-width: 100px) {

     nav#singlepage-nav {
    float: left;
    width: 100%;
}
/*.nav-menu {
    float: left;
    width: 75px;
    height: 82px;
    right: -20px;
    display: inline-block;
    position: absolute;
    z-index: 9999999999999 !important;
}*/
.logo {
    float: left;
    width: 70% !important;
}

h4.subheading.normalfont {
    font-size: 1.7rem;
    text-transform: capitalize;
    font-weight: 400;
    margin-bottom: 20px !important;
    color: #000 !important;
    padding: 0px 20px;
    line-height: 2rem;
}

p.text-muted.all70 {
    padding-bottom: 30px !important;
    width: 80% !important;
}


     .timeline-centered {
    margin: 0px 0px;
}
     img.centerimage {
          width: 100%;
          margin: 0 auto;
          margin-bottom: 25px !important;
     }
     img.lefimg {
          float: left;
          width: 100%;
          margin: 0px 0px 20px 0px;
     }
     .tp-splitted.tp-linesplit {
          margin-top: 15px;
     }
     img.rightimage {
          float: right;
          width: 100%;
          margin: 0px 0px 20px 0px;
     }
     .how-img img {
          margin-bottom: 30px;
     }
}

.nav.nav-tabs {
     float: left;
     display: block;
     margin-right: 20px;
     border-bottom: 0;
     border-right: 1px solid #ddd;
     padding-right: 15px;
}

.nav-tabs .nav-link {
     border: 1px solid transparent;
     border-top-left-radius: .25rem;
     border-top-right-radius: .25rem;
     background: #ccc;
     line-height: 33px !important;
}

.nav-tabs .nav-link.active {
     color: #38311c !important;
     background-color: #dfbe5e !important;
     border-color: transparent !important;
}

.nav-tabs .nav-link {
     border-top-left-radius: 0rem!important;
     border-top-right-radius: 0rem!important;
     color: #333 !important;
     background: #fff;
     border: none;
     font-weight: 500;
}

.tab-content>.active {
     display: block;
     background: #dfbe5e;
     min-height: 288px;
     margin-bottom: 20px;
}

.nav.nav-tabs {
     float: left;
     display: block;
     margin-right: 20px;
     border-bottom: 0;
     border-right: 1px solid transparent;
     padding-right: 15px;
}

.tab-pane p {
     color: #3e3824 !important;
     font-size: 17px;
     line-height: 26px;
     padding: 0px 20px;
}

.tab-pane h3 {
     color: #38311c !important;
     padding: 25px 0px 5px 0px;
     font-weight: bold;
}

.padding {
     padding: 0px 2rem 0rem 2rem;
}

.backgrundimage {
    /* background: #4e1c45; */
    padding: 0px !important;
    border-radius: 5px;
}

#back-top span:before {
     color: #b9ab7a !important;
}

a.left {
     float: left;
}

a.right {
     float: right;
}

.loactionfind a {
     font-size: 13px;
     color: #303030;
     text-decoration: underline !important;
     font-weight: 500;
     display: inline-block;
     padding: 10px 13px;
}

.loactionfind {
     border-radius: 0px;
     /* box-shadow: 0 2px 10px #ddd;
     */
     background: #e9e9e9;
     text-align: center;
     margin-bottom: 30px;
     float: left;
     width: 100%;
     border: 1px solid #ddd;
     position: relative;
     overflow: hidden;
     padding-bottom: 5px;
}

#map-canvas {
     width: 100%;
     height: 350px;
     display: block;
}

.globalcountry {
     float: left;
     width: 100%;
     padding: 30px 30px;
}

.country {
font-weight: 400;
    padding: 0px 3px;
    left: 0;
    top: 0;
    width: 100%;
    text-align: left;
    background: transparent !important;
    font-size: 15px;
    text-transform: uppercase;
    color: #000;
}

.loactionfind h3 {
     color: #000;
     font-size: 1rem;
     font-weight: bold;
     margin: 5px;
     margin-top: 10px;
     margin-bottom: 10px;
}

.namerica {
     background: #024a72;
}

.german {
     background: #654222;
}

.sasia {
     background: #005900;
}

.seasia {
     background: #d08803;
}

.oceania {
     background: #eb2828;
}

.meast {
     background: #007464;
}

.africa {
     background: #616161;
}

body::-webkit-scrollbar {
     width: 1em;
}

body::-webkit-scrollbar-track {
     -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

body::-webkit-scrollbar-thumb {
     background-color: darkgrey;
     outline: 1px solid slategrey;
}

#map {
     margin: 0 auto;
     width: 100%;
     height: 450px;
}

.gm-style-iw-d b {
     font-weight: bold;
     color: #000 !important;
     line-height: 22px;
     font-size: 1.1rem;
}

.gm-style-iw-d a {
     font-weight: 500;
     color: rgb(89, 76, 46) !important;
     font-size: 12px;
}

.col7 ul {
list-style-type: none;
    color: #000;
    font-size: 12px;
    margin: 15px 0px;
    padding: 0px 4px;
    text-align: left;
}
.col7 ul li {
    text-transform: capitalize !important;
}
section.blog {
     text-align: center !important;
}

.img-rounded {
     border-radius: 3px;
}

.img-thumbnail {
     background-color: #fff;
     border: 1px solid #ededf0;
     border-radius: 3px;
     display: inline-block;
     height: auto;
     line-height: 1.428571429;
     max-width: 100%;
     moz-transition: all .2s ease-in-out;
     o-transition: all .2s ease-in-out;
     padding: 2px;
     transition: all .2s ease-in-out;
     webkit-transition: all .2s ease-in-out;
}

.img-circle {
     border-radius: 50%;
}

.timeline-centered {
     position: relative;
     margin-bottom: 30px;
}

.timeline-centered:before,
.timeline-centered:after {
     content: " ";
     display: table;
}

.timeline-centered:after {
     clear: both;
}

.timeline-centered:before,
.timeline-centered:after {
     content: " ";
     display: table;
}

.timeline-centered:after {
     clear: both;
}

.timeline-centered:before {
     content: '';
     position: absolute;
     display: block;
     width: 4px;
     background: #f5f5f6;
     left: 50%;
     top: 20px;
     bottom: 20px;
     margin-left: -4px;
}

.timeline-centered .timeline-entry {
     position: relative;
     width: 50%;
     float: right;
     margin-bottom: 70px;
     clear: both;
}

.timeline-centered .timeline-entry:before,
.timeline-centered .timeline-entry:after {
     content: " ";
     display: table;
}

.timeline-centered .timeline-entry:after {
     clear: both;
}

.timeline-centered .timeline-entry:before,
.timeline-centered .timeline-entry:after {
     content: " ";
     display: table;
}

.timeline-centered .timeline-entry:after {
     clear: both;
}

.timeline-centered .timeline-entry.begin {
     margin-bottom: 0;
}

.timeline-centered .timeline-entry.left-aligned {
     float: left;
}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner {
     margin-left: 0;
     margin-right: -9px;
}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-time {
     left: auto;
     right: -100px;
     text-align: left;
}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-icon {
     float: right;
}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label {
     margin-left: 0;
     margin-right: 70px;
}

.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label:after {
     left: auto;
     right: 0;
     margin-left: 0;
     margin-right: -9px;
     -moz-transform: rotate(180deg);
     -o-transform: rotate(180deg);
     -webkit-transform: rotate(180deg);
     -ms-transform: rotate(180deg);
     transform: rotate(180deg);
}

.timeline-centered .timeline-entry .timeline-entry-inner {
    position: relative;
    margin-left: -12px;
}

.timeline-centered .timeline-entry .timeline-entry-inner:before,
.timeline-centered .timeline-entry .timeline-entry-inner:after {
     content: " ";
     display: table;
}

.timeline-centered .timeline-entry .timeline-entry-inner:after {
     clear: both;
}

.timeline-centered .timeline-entry .timeline-entry-inner:before,
.timeline-centered .timeline-entry .timeline-entry-inner:after {
     content: " ";
     display: table;
}

.timeline-centered .timeline-entry .timeline-entry-inner:after {
     clear: both;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time {
     position: absolute;
     left: -100px;
     text-align: right;
     padding: 10px;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
         top: -9px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time>span {
     display: block;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time>span:first-child {
font-size: 34px;
    font-weight: 300;
    color: #333;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon {
    background: #fff;
    color: #737881;
    display: block;
    width: 20px;
    height: 20px;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding;
    background-clip: padding-box;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    text-align: center;
    -moz-box-shadow: 0 0 0 5px #f5f5f6;
    -webkit-box-shadow: 0 0 0 5px #f5f5f6;
    box-shadow: 0 0 0 5px #f5f5f6;
    line-height: 40px;
    font-size: 15px;
    float: left;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-primary {
     background-color: #303641;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-secondary {
     background-color: #ee4749;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-success {
     background-color: #00a651;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-info {
     background-color: #21a9e1;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-warning {
     background-color: #fad839;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon.bg-danger {
     background-color: #cc2424;
     color: #fff;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label {
     position: relative;
     background: #f5f5f6;
     padding: 1.7em;
     margin-left: 70px;
     -webkit-background-clip: padding-box;
     -moz-background-clip: padding;
     background-clip: padding-box;
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     border-radius: 3px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label:after {
     content: '';
     display: block;
     position: absolute;
     width: 0;
     height: 0;
     border-style: solid;
     border-width: 9px 9px 9px 0;
     border-color: transparent #f5f5f6 transparent transparent;
     left: 0;
     top: 10px;
     margin-left: -9px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2,
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p {
     color: #323438;
     font-size: 15px;
     margin: 0;
     line-height: 1.428571429;
     text-align: left;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p+p {
     margin-top: 15px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 {
     font-size: 16px;
     margin-bottom: 10px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 a {
     color: #303641;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 span {
     -webkit-opacity: .6;
     -moz-opacity: .6;
     opacity: .6;
     -ms-filter: alpha(opacity=60);
     filter: alpha(opacity=60);
}

.row.fullsecti {
     padding: 1px 50px;
}

p.ffon {
    font-size: 1.3rem;
    font-weight: 300;
    line-height: 1.7rem;
}a.img-thumb .img-fluid {
    max-width: 100%;
}


.zooming  {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

.zooming img {
     -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    max-width: 100%;
}
.zooming:hover img {
    transform: scale(1.1) !important;
    -o-transform: scale(1.1) !important;
    -moz-transform: scale(1.1) !important;
    -webkit-transform: scale(1.1) !important;
    -ms-transform: scale(1.1) !important;
    opacity: 1 !important;
}

img.fullresponsive {
    width: 100%;
    float: left;
    margin-bottom: 60px !important;
}
.how21 .row:last-child {
    margin-bottom: 40px;
}
h2.mainhead.newdesign {
     padding-bottom: 0px !important;
     padding-top: 1% !important;
     line-height: .8;
}
.playfairfont {
    font-family: 'Playfair Display', serif !important;
    font-style: italic;
}

.modal-body {
    color: #000;
    float: left;
    width: 100%;
    padding: 0px 50px !important;
    margin-bottom: 50px;
}.modal-body h1 {
    font-size: 1.5rem;
    color: #000 !important;
    text-align: center;
    text-transform: uppercase;
    font-weight: 500;
}
.modal-body label {
    padding: 0px 0px 0px 10px!important;
}
ul.footerlocation li {
    display: block;
    font-size: 16px;
    margin: 10px 10px;
}

ul.footerlocation {
    list-style-type: none;
    padding: 0px;
    margin: 5px 0px 30px 0px;
}
ul.appdownload {
    padding: 0px;
    margin: 0px 0px 60px 0px;
}ul.appdownload li img {
    width: 200px;
}
ul.appdownload li {
    display: inline;
    margin: 13px 5px;
}


section#governance {
    padding: 14rem 0px;
    background-image: url(../images/governance.jpg);
    /* background-attachment: fixed; */
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
}

a.btn.btn-primary.diwbk i {
    margin: 0 auto;
    color: red;
    text-align: center;
    font-size: 30px;
    width: 100%;
}
a.btn.btn-primary.diwbk {
    background: transparent;
    text-align: center !important;
    float: left;
    border: 1px solid #ddd;
    width: 100%;
    padding: 16px 0px;
}
a.btn.btn-primary.diwbk span {
    float: left;
    width: 100%;
    color: #000;
    padding-top: 10px;
}
.avernase h4 {
    font-size: 18px !important;
    color: #000 !important;
}
.avernase {
    border: 0px !important;
    border-radius: 15px;
    margin-bottom: 30px;
    padding: 0px !important;
}
.paddinggrand {
     padding: 30px 30px 80px 30px;
}

img.imgin {
    width: 100% !important;
    height: auto !important;
}.text-custom {
    text-align: left;
}h3.boundhead {
    font-size: 2.5rem !important;
    color: #fff !important;
    line-height: 2.5rem !important;
    margin: 0px !important;
    font-weight: 900 !important;
    letter-spacing: 0px !important;
    padding-bottom: 14px !important;
}p.subbig {
    font-size: 1.7rem !important;
    font-weight: 300 !important;
    color: #fff !important;
    line-height: 2rem !important;
}p.italicfont {
    font-family: 'Playfair Display', serif !important;
    font-style: italic;
    font-weight: 400 !important;
    color: #fff !important;
}.normalfont {
    font-weight: 300 !important;
    color: #fff !important;
}a.normalfont {
    margin-top: 13px !important;
    float: left;
    width: 100%;
}
a.donatebutton {
     position: absolute;
     right: 0;
     top: 0;
     background: #701600;
     padding: 0px 0px !important;
     height: 70px !important;
     line-height: 71px;
     font-weight: 500;
     color: #ffffff !important;
 }
 a.donatebutton:hover {
     background: rgb(89, 76, 46);
 }
 .pdfconten h2 {
     color: #222222 !important;
     text-decoration: underline;
     font-size: 1.4rem !important;
 }
 .pdfconten li {
     padding-bottom: 10px !important;
 }
 .pdfconten p, .pdfconten ul, .pdfconten ol, .pdfconten li, .pdfconten table {
     text-align: left !important;
     line-height: 1.3 !important;
     font-size: 1.1rem !important;
     color: #363636 !important;
 }
 img.fullwidth {
     width: 100% !important;
 }
 .pdfconten {
     padding: 30px;
     text-align: left;
 }
@media (max-width: 90000px) and (min-width: 768px) {
p.italicfont {
    line-height: 1.4rem !important;
    font-size: 1rem !important;
}.normalfont {
    line-height: 1.4rem !important;
    font-size: 1rem !important;
}
.header-inner {
     padding-right: 140px !important;
 }
 a.donatebutton {
     width: 100px !important;
 }


}


@media (max-width: 768px) and (min-width: 100px) {
     a.ic.menu {
          right: 0px !important;
      }
.text-custom {
    text-align: center !important;
}
p.italicfont {
    font-size: 13px !important;
    line-height: 15px !important;
}.normalfont {
    font-size: 13px !important;
    line-height: 15px !important;
}
a.donatebutton {
     width: 80px !important;
 }

img.imgin {
    width: 130px !important;
    padding-top: 35px !important;
}

}

section.telecast {
    margin-top: -35px;
    border-bottom: 0px solid #868686;
}
.videocard {
     border: 1px solid #ddd;
     border-radius: 10px;
     height: 200px;
     overflow: hidden;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     position: relative;
     margin-bottom: 30px;
 }
 .videosectioninner {
     width: 95%;
     margin: 0 auto;
 }
 .videocard img.youtube-click {
     width: 100%; /* Scale image to the width of the container */
     height: 100%; /* Scale image to the height of the container */
     object-fit: cover; /* Ensures the image covers the area without distortion */
     object-position: center; /* Centers the cropped image */
     border-radius: 8px; /* Optional: adds rounded corners */
 }
 .videocard h3 {
     position: absolute;
     bottom: -10px;
     background: white;
     width: 100%;
     left: 0;
     right: 0;
     text-align: left;
     padding: 13px 20px 15px 25px;
     color: black;
     font-size: 1rem;
 }
 .videocard img.iconvideon {
     position: absolute;
     right: 25px;
     bottom: 68px;
     z-index: 11;
     width: 50px;
     height: 50px;
 }

/* Statistics Counter Styles */
.stat-counter {
     padding: 20px 10px;
}

.stat-number {
     font-size: 3rem;
     font-weight: 700;
     color: #ffffff;
     line-height: 1;
     margin-bottom: 10px;
     font-family: 'Roboto', sans-serif;
}

.stat-label {
     color: #ffffff;
     font-size: 0.9rem;
     line-height: 1.2;
     font-weight: 400;
     font-family: 'Roboto', sans-serif;
}

.stat-label div {
     margin-bottom: 2px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
     .stat-number {
         font-size: 2.5rem;
     }
     
     .stat-label {
         font-size: 0.8rem;
     }
     
     .stat-counter {
         padding: 15px 5px;
     }
}

@media (max-width: 576px) {
     .stat-number {
         font-size: 2rem;
     }
     
     .stat-label {
         font-size: 0.75rem;
     }
     
     .stat-counter {
         padding: 10px 5px;
     }
}



.insidebannerback {
     background-color: #19263B;
     width: 100%;
     position: relative;
     border-radius: 20px;
     margin-top: 17rem;
     padding: 8rem 20px 10px 20px;
 }
img.toploginin {
     width: 450px;
     height: auto;
     object-fit: cover;
     object-position: center;
     position: absolute;
     top: -16rem;
     left: 0;
     right: 0;
     margin: 0 auto;
}

/* Challenge Cards Styles */
.challenge-card {
     background-color: #007571;
     padding: 25px 20px;
     border-radius: 8px;
     height: 100%;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
     margin-bottom: 20px;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.challenge-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
}

.challenge-card h3 {
     color: #ffffff;
     font-size: 1.1rem;
     font-weight: 600;
     line-height: 1.3;
     margin-bottom: 15px;
     font-family: 'Roboto', sans-serif;
}

.challenge-card p {
     color: #ffffff;
     font-size: 0.9rem;
     line-height: 1.4;
     margin-bottom: 0;
     font-family: 'Roboto', sans-serif;
     flex-grow: 1;
     display: flex;
     align-items: flex-start;
}

/* Responsive Design */
@media (max-width: 991.98px) {
     .challenge-card {
         padding: 20px 15px;
         margin-bottom: 15px;
     }
     
     .challenge-card h3 {
         font-size: 1rem;
     }
     
     .challenge-card p {
         font-size: 0.85rem;
     }
}

@media (max-width: 767.98px) {
     .challenge-card {
         padding: 18px 12px;
         margin-bottom: 12px;
     }
     
     .challenge-card h3 {
         font-size: 0.95rem;
         margin-bottom: 12px;
     }
     
     .challenge-card p {
         font-size: 0.8rem;
     }
}

@media (max-width: 575.98px) {
     .challenge-card {
         padding: 15px 10px;
         margin-bottom: 10px;
     }
     
     .challenge-card h3 {
         font-size: 0.9rem;
         margin-bottom: 10px;
     }
     
     .challenge-card p {
         font-size: 0.75rem;
     }
}

/* Saint Cards Styles */
.saint-card {
     background-color: #ffffff;
     border: 1px solid #e0e0e0;
     border-radius: 8px;
     overflow: hidden;
     height: 100%;
     display: flex;
     flex-direction: column;
     transition: transform 0.3s ease, box-shadow 0.3s ease;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.saint-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.saint-image {
     width: 100%;
     height: auto;
     overflow: hidden;
     position: relative;
}

.saint-image img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     object-position: center;
     filter: grayscale(100%);
     transition: filter 0.3s ease;
}

.saint-card:hover .saint-image img {
     filter: grayscale(0%);
}

.saint-content {
     padding: 25px 20px;
     text-align: center;
     flex-grow: 1;
     display: flex;
     flex-direction: column;
     justify-content: space-between;
}

.saint-title-small {
     font-size: 0.9rem;
     color: #8B7355;
     font-weight: 400;
     margin-bottom: 5px;
     font-family: 'Roboto', sans-serif;
}

.saint-name {
     font-size: 1.5rem;
     font-weight: 700;
     color: #8B7355;
     margin-bottom: 8px;
     font-family: 'Roboto', sans-serif;
}

.saint-years {
     font-size: 1rem;
     color: #8B7355;
     font-weight: 600;
     margin-bottom: 15px;
     font-family: 'Roboto', sans-serif;
 }

.saint-description {
     font-size: 1.2rem;
     color: #394659;
     line-height: 1.4;
     margin-bottom: 15px;
     font-family: 'Roboto', sans-serif;
     flex-grow: 1;
}

.saint-beatified {
     font-size: 0.95rem;
     color:#394659;
     font-weight: 600;
     margin-bottom: 20px;
     font-family: 'Roboto', sans-serif;
}

.saint-button {
     background-color: transparent;
     border: 2px solid #394659;
     color: #394659;
     padding: 13px 25px;
     font-size: 0.9rem;
     font-weight: 600;
     text-transform: uppercase;
     letter-spacing: 0.5px;
     transition: all 0.3s ease;
     font-family: 'Roboto', sans-serif;
     cursor: pointer;
     width: 100%;
     max-width: 200px;
     margin: 0 auto;
     border-radius: 30px;
}

.saint-button:hover {
     background-color: #8B7355;
     color: #ffffff;
     transform: translateY(-2px);
}

/* Responsive Design for Saint Cards */
@media (max-width: 991.98px) {
     .saint-image {
         height: auto;
     }
     
     .saint-content {
         padding: 20px 15px;
     }
     
     .saint-name {
         font-size: 1.3rem;
     }
     
     .saint-description {
         font-size: 0.9rem;
     }
}

@media (max-width: 767.98px) {
     .saint-image {
         height: auto;
     }
     
     .saint-content {
         padding: 18px 12px;
     }
     
     .saint-name {
         font-size: 1.2rem;
     }
     
     .saint-description {
         font-size: 0.85rem;
     }
     
     .saint-button {
         padding: 8px 20px;
         font-size: 0.8rem;
     }
}

@media (max-width: 575.98px) {
     .saint-image {
         height: auto;
     }
     
     .saint-content {
         padding: 15px 10px;
     }
     
     .saint-name {
         font-size: 1.1rem;
     }
     
     .saint-description {
         font-size: 0.8rem;
     }
     
     .saint-button {
         padding: 8px 15px;
         font-size: 0.75rem;
     }
}


@media (max-width: 768px) and (min-width: 100px) {
     img.toploginin {
          width: 300px !important;
          top: -10rem !important;
      }
      .insidebannerback {
          margin-top: 11rem !important;
      }.col-12.col-md-3.col-lg-3 {
          margin-bottom: 10px !important;
      }
}