 

/* START BUTTON */
.btnTheme { background: #EDC162; border: 1px solid #EDC162; box-shadow:none; border-radius: 5px; color: #000; font-size: 20px;
line-height: 25px; font-weight: 600; padding: 12px 25px; text-decoration: none; transition: all 0.5s ease; text-transform: uppercase; position: relative; overflow: hidden; z-index: 1; }
.btnTheme:hover, .btnTheme:focus { border: 1px solid #E6E6E6; color: #fff; }
.btnTheme:before , .btnTheme:after { background: #414140; position: absolute; content: ""; width: 50%; height: 0; visibility: hidden; opacity: 0; z-index: -1; transition: all .4s ease-in-out; }
.btnTheme:before { top: 0; left: 0; }
.btnTheme:after { bottom: 0; right: 0; }
.btnTheme:hover:before, .btnTheme:hover:after { width: 100%; height: 100%; visibility: visible; opacity: 1; }

.btnWhite { background: #fff; border: 1px solid #fff; box-shadow:none; border-radius: 5px; color: #000; font-size: 20px;
line-height: 25px; font-weight: 600; padding: 12px 25px; text-decoration: none; transition: all 0.5s ease; text-transform: uppercase; position: relative; overflow: hidden; z-index: 1; }
.btnWhite:hover, .btnWhite:focus { border: 1px solid #243CA9; color: #fff; }
.btnWhite:before , .btnWhite:after { background: #243CA9; position: absolute; content: ""; width: 50%; height: 0; visibility: hidden; opacity: 0; z-index: -1; transition: all .4s ease-in-out; }
.btnWhite:before { top: 0; left: 0; }
.btnWhite:after { bottom: 0; right: 0; }
.btnWhite:hover:before, .btnWhite:hover:after { width: 100%; height: 100%; visibility: visible; opacity: 1; }

.btnBlue { background: #243CA9; border: 1px solid #243CA9; box-shadow:none; border-radius: 5px; color: #fff; font-size: 20px;
line-height: 25px; font-weight: 600; padding: 12px 25px; text-decoration: none; transition: all 0.5s ease; text-transform: uppercase; position: relative; overflow: hidden; z-index: 1; }
.btnBlue:hover, .btnBlue:focus { border: 1px solid #E6E6E6; color: #000; }
.btnBlue:before , .btnBlue:after { background: #fff; position: absolute; content: ""; width: 50%; height: 0; visibility: hidden; opacity: 0; z-index: -1; transition: all .4s ease-in-out; }
.btnBlue:before { top: 0; left: 0; }
.btnBlue:after { bottom: 0; right: 0; }
.btnBlue:hover:before, .btnBlue:hover:after { width: 100%; height: 100%; visibility: visible; opacity: 1; }

.btnTransparent { background: transparent; border: 1px solid #fff; box-shadow:none; border-radius: 5px; color: #fff; font-size: 20px; line-height: 25px; font-weight: 600; padding: 6px 10px; text-decoration: none; transition: all 0.5s ease; text-transform: uppercase; position: relative; overflow: hidden; z-index: 1; }
.btnTransparent:hover, .btnTransparent:focus { border: 1px solid #fff; color: #000; }
.btnTransparent:before , .btnTransparent:after { background: #EDC162; position: absolute; content: ""; width: 50%; height: 0; visibility: hidden; opacity: 0; z-index: -1; transition: all .4s ease-in-out; }
.btnTransparent:before { top: 0; left: 0; }
.btnTransparent:after { bottom: 0; right: 0; }
.btnTransparent:hover:before, .btnTransparent:hover:after { width: 100%; height: 100%; visibility: visible; opacity: 1; }
/* END BUTTON */

/* START COMMON CSS */
.headingOther { margin: 0 0 30px; display: flex; width: 100%; justify-content: space-between;align-items: center; }
.headingOther h2 { font-size: 50px; line-height: 60px; margin: 0; text-transform: uppercase; color: #fff; font-weight: 400; position: relative; }
.btnRight {  margin-right: 10px; }
.headingOther h2 span { color: #fff; }
.headingOther p {  font-size: 18px; line-height: 24px; margin: 0 0 15px; }
.borderGrey { margin: 0 0 10px; background: #464671; height: 1px; position: relative; }
.borderGrey:before { background: #464671; content:""; position: absolute; right: -500px; top: 0; width: 500px; height: 1px; }

h2 { color: #fff; font-size: 50px; line-height: 60px; font-weight: 400;}
h3 { font-size: 26px; line-height: 31px; font-weight: 400; }
h4 { font-size: 18px; line-height: 23px; font-weight: 400; }
p {	font-size: 14px; line-height: 29px; color: #fff; font-weight: 400; }
body { background: #000; background: linear-gradient(0deg, #040304 0%, #00003F 50%, #00003F 100%);

 color: #fff; font-family: 'Gomme Sans'; font-size: 15px; line-height: 20px; margin: 0; padding: 0; }
/* END COMMON CSS */

/* START HEADER */
header {background: #1039A3; margin: 0; min-height: 52px; width: 100%; position: relative; }
.navbar-nav { margin-top: 10px; padding-left: 50px; }
.navbar {background: transparent !important; Padding: 0; }
.navbar-brand { height: auto; margin: 0; padding: 20px 0; }
.navbar-brand>img { width: 180px; }
.navbar-nav li { padding: 0 20px; }
.navbar-light .navbar-nav .nav-link { color: #fff; font-size: 18px; line-height: 24px; font-weight: 600; padding: 0; 
text-decoration: none; text-transform: capitalize; cursor: pointer; }
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link {  color: #EDC162;  }
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus { color: #EDC162;text-decoration: none; }
.headerRight { margin: 0; padding: 0; display: flex; gap: 0 30px;  justify-content: end; align-items: center; }
.headerRight li { list-style-type: none;  }
.headerRight li a { margin: 0; color: #fff; font-size: 18px; line-height: 24px; font-weight: 600; text-decoration: none; padding: 0; transition: all 0.3s ease-in-out 0s; position: relative; }
.headerRight li a:hover { color: #EDC162; }
.headerRight li a img { margin: 0; }
.headerRight li a.btnTheme {padding: 12px 20px; font-size: 16px; color: #000;  }
.headerRight li a.btnTheme:hover, .headerRight li a.btnTheme:hover{  color: #fff;}
/* END HEADER */


/* START Banner */ 
.banner { background: transparent; position: relative; width: 100%; overflow: hidden; } 
.bannerLeft { position: relative; padding: 0; text-align: left;width: 500px; max-width: 100%; }
.bannerLeft span { font-size: 16px; line-height: 20px; font-weight: 500; margin: 0 0 20px; text-transform: capitalize;    background: #EDC162; border: 1px solid #EDC162; color: #000; padding: 2px 5px; display: inline-block; border-radius: 4px; display: inline-block; }
.bannerLeft img { width: 320px; display: block; margin: 0 0 10px; } 
.bannerLeft p { font-weight: 300; font-size: 18px; line-height: 24px; margin: 0 0 40px; color: #fff; }
.bannerBtn { display: flex; justify-content: start; align-items: center; gap: 20px; }
.bannerBtn .btn { padding: 15px 40px;  }
.banner .carousel-item .bannerImage { height: calc(100vh - 100px); object-fit: cover; width: 100%; display: block; }
.banner .carousel-indicators { margin-bottom: 4rem; }
.banner .carousel-indicators [data-bs-target] { width: 18px; height: 18px; border-radius: 50%; background: #fff; border: 1px solid #fff; opacity: 1; }
.banner .carousel-indicators .active { background: #1039a3;}
.banner .carousel-caption { bottom: auto; transform: translateY(-50%); top: 50%;; right: 0; left: 0; }
.banner .carousel-control-prev { left: -50px; opacity: 1; display: none; }
.banner .carousel-control-next { right: -50px; opacity: 1; }
.banner .carousel-control-prev-icon { background-image: url("../images/arrowLeft.svg"); width: 44px; height: 44px; background-size: 100% 100%; }
.banner .carousel-control-next-icon { background-image: url("../images/arrowRight.svg"); width: 44px; height: 44px; background-size: 100% 100%; }
/* END banner */
 
/* START commonMain */
.commonMain .owl-theme .owl-nav .owl-prev, .commonMain .owl-theme .owl-nav .owl-next { font-size: 0; background: transparent; padding: 7px 14px; position: absolute; top: calc(50% - 27px); border-radius: 3px; width: 36px; height: 36px;}
.commonMain .owl-theme .owl-nav .owl-prev {  left: -60px; }
.commonMain .owl-theme .owl-nav .owl-next {  right: -60px; }
.commonMain .owl-theme .owl-nav .owl-prev:before, .commonMain .owl-theme .owl-nav .owl-next:before {   position: absolute; 
top: 50%; left: 50%; transform: translate(-50%, -50%);}
.commonMain .owl-theme .owl-nav .owl-prev:before { content: ""; background: url("../images/arrowLeft.svg");    width: 44px; height: 44px; background-size: 100% 100%; }
.commonMain .owl-theme .owl-nav .owl-next:before { content: ""; background: url("../images/arrowRight.svg");
width: 44px; height: 44px; background-size: 100% 100%; }
.commonMain .owl-theme .owl-dots { margin-top: 30px !important; }
.commonMain .owl-theme .owl-dots .owl-dot span { background: #fff; border: 1px solid #fff; width: 18px; height: 18px; margin: 0 5px; border-radius: 50%; }
.commonMain .owl-theme .owl-dots .owl-dot.active span, .commonMain .owl-theme .owl-dots .owl-dot:hover span { background: #1039a3; border: 1px solid #fff; }
.commonSlideOuter { width: calc(100% + 33%); }
.commonMain .owl-theme .owl-nav .owl-prev.disabled {  display: none; }
.commonMain .owl-theme .owl-nav .owl-next.disabled {  display: none; }
.commonMain .owl-theme .owl-nav .owl-next { right: 20%; }
.commonMain .owl-item { transition: opacity 0.3s; }
/* END commonMain */

/* START trendingMain */
.trendingMain { background: transparent; position: relative; padding: 80px 0 80px; overflow: hidden; width: 100%;  }
.trendingDetails { display: inline-block; width: 100%; position: relative; min-height: 180px; border-radius: 4px; }
.trendingDetails a { margin: 0; }
.trendingDetails img { margin: 0; }
/* END trendingMain */

/* START newsMain */
.newsMain { background: transparent; position: relative; padding: 40px 0 60px; overflow: hidden; width: 100%; }
.newsDetails { display: inline-block; width: 100%; position: relative; min-height: 180px; border-radius: 4px;
overflow: hidden; } 
.newsDetails img { margin: 0; }
.newsInner { position: absolute; bottom: 0; text-align: center; width: 100%; padding: 0 12px; }
.newsInner h4 a { color: #fff; font-size: 35px; line-height: 45px; margin: 0 0 10px; text-transform: uppercase; 
font-weight: 700; text-decoration: none; position: relative; z-index: 1; }
.newsInner:before { content: ""; width: 100%; height: 160%; position: absolute; left: 0; bottom: 0;
background: linear-gradient(0deg, #224380 0%, transparent 100%); }
.newsMain .owl-item:nth-child(2) .newsInner:before { background: linear-gradient(0deg, #AD0028 0%, transparent 100%); } 
.newsMain .owl-item:nth-child(3) .newsInner:before { background: linear-gradient(0deg, #80226A 0%, transparent 100%); }
.newsMain .owl-item:nth-child(4) .newsInner:before { background: linear-gradient(0deg, #227280 0%, transparent 100%); } 
/* END newsMain */

 /* START faithMain */
.faithMain { background: transparent; position: relative; padding: 40px 0 60px; overflow: hidden; width: 100%;  }
.faithDetails { display: inline-block; width: 100%; position: relative; min-height: 180px; border-radius: 4px; }
.faithDetails a { margin: 0; }
.faithDetails img { margin: 0; }
/* END faithMain */

/* START familyMain */
.familyMain { background: transparent; position: relative; padding: 40px 0 60px; overflow: hidden; width: 100%; }
.familyDetails { display: inline-block; width: 100%; position: relative; min-height: 180px; border-radius: 4px;
overflow: hidden; } 
.familyDetails img { margin: 0; }
.familyInner { position: absolute; bottom: 0; text-align: center; width: 100%; padding: 0 12px; }
.familyInner h4 a { color: #fff; font-size: 34px; line-height: 45px; margin: 0 0 10px; text-transform: uppercase; 
font-weight: 700; text-decoration: none; position: relative; z-index: 1; }
.familyInner:before { content: ""; width: 100%; height: 160%; position: absolute; left: 0; bottom: 0;
background: linear-gradient(0deg, #224380 0%, transparent 100%); }
.familyMain .owl-item:nth-child(2) .familyInner:before { background: linear-gradient(0deg, #227280 0%, transparent 100%); } 
.familyMain .owl-item:nth-child(3) .familyInner:before { background: linear-gradient(0deg, #80226A 0%, transparent 100%); }
.familyMain .owl-item:nth-child(4) .familyInner:before { background: linear-gradient(0deg, #AD0028 0%, transparent 100%); } 
/* END familyMain */

 /* START kidsMain */
.kidsMain { background: transparent; position: relative; padding: 40px 0 60px; overflow: hidden; width: 100%;  }
.kidsDetails { display: inline-block; width: 100%; position: relative; min-height: 180px; border-radius: 4px; }
.kidsDetails a { margin: 0; }
.kidsDetails img { margin: 0; max-height: 600px;}
/* END kidsMain */

/* START FOOTER */
.footer { background: #1039A3; margin: 0; width: 100%; position: relative; overflow: hidden; } 
.footerTop { padding: 60px 0 0; }
.logoFooter { display: flex; margin: 0 0 50px; width: 100%; justify-content: space-between; align-items: center; }
.logoFooter img { width: 180px; }
.footerTop h3 { color: #fff; font-weight: 600; font-size: 22px; line-height: 25px; text-transform: uppercase; 
position: relative; border-bottom: 1px solid #fff; margin: 0 0 20px; padding: 0 0 20px; }
.footerTop h4 { color: #fff; font-weight: 400; font-size: 18px; line-height: 22px; text-transform: capitalize;
position: relative; margin: 0 0 10px; }
.footerInner { margin: 0 0 30px; display: inline-block; width: 100%; }
.footerInner ul { margin: 0; padding: 0;}
.footerInner ul li { list-style-type: none; margin: 0 0 10px;   font-size: 16px; line-height: 22px; }
.footerInner ul li a { color: #fff; font-size: 16px; line-height: 22px; text-transform: capitalize; text-decoration: none; position: relative; margin: 0; display: inline-block; font-weight: 400; }
.footerInner ul li a:hover, .footerInner li a:focus { color: #EDC162; transition: 0.5s; }
.footerData { margin: 0 0 40px; }
.footerData p { margin: 0 0 30px; text-align: center; font-size: 16px; line-height: 25px; width: 100%; }
.footerInner_4 { text-align: right; }
.footerInner_4 .btn { text-transform: capitalize; padding: 12px 20px; }
.searchFooter { font-size: 28px; }
/* END footer */
 