@font-face {
  font-family: "socialico";
  src: url("fonts/Socialico/Socialico.eot");
  src: url("fonts/Socialico/Socialico.eot?#iefix") format("embedded-opentype"),
    url("fonts/Socialico/Socialico.woff2") format("woff2"),
    url("fonts/Socialico/Socialico.woff") format("woff"),
    url("fonts/Socialico/Socialico.ttf") format("truetype"),
    url("fonts/Socialico/Socialico.svg") format("svg");
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  max-width: 100%;
  min-width: 1200px;
  margin: 0 auto;
  text-align: center;
  font-family: 'Montserrat', sans-serif!important;
  line-height: 1.2;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  text-decoration: none;
  color: inherit;
}
h1,
h2,
h3,
h4,
h5 {
  padding: 0;
  margin: 0;
  font-family: 'Playfair Display', serif;
  letter-spacing: 2px;
  line-height: 1.2;
}
p, ul li{
  font-size: 18px;
  letter-spacing: 1px;  
}
img{
  max-width:  100%;
}
img:not(#gallery img){
  border-radius: 5px;
  box-shadow: 5px 5px 2px 0px rgba(9,108,254,0.2)
}
.row {
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
  padding:0 10px;
}
.flex{
  display: flex;
  justify-content: space-around;
  align-items: center;
}

/*clearings*/
.clear {
  clear: both;
}
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  font-size: 0;
}
.clearfix {
  display: block;
}

/*cookie*/
.cc-animate.cc-revoke.cc-bottom {
  font-size: 14px;
  padding: 5px 10px;
  position: fixed;
  display: block !important;
  transform: none !important;
  bottom: 0 !important;
  left: 20px !important;
}

/*call to action*/
.destroy-on-load,
.cta {
  display: none;
}

/*gallery*/
main .gallery-container {
  text-align: center;
}
main .gallery {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
main .gallery li {
  display: inline-block;
}
main .thumbnail {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  display: block;
  line-height: 0.42857;
  margin-bottom: 20px;
  padding: 4px;
  transition: border 0.5s ease-in-out 0s;
}
main .thumbnail:hover {
  transform: scale(1.02);
}
main .page_navigation {
  display: inline-block;
}
main .page_link,
main .previous_link,
main .next_link,
main .first_link,
main .last_link,
main .ellipse {
  background-color: #fff;
  border: 1px solid #ddd;
  color: #0275d8;
  display: inline-block;
  line-height: 1.25;
  margin-left: -1px;
  padding: 0.5rem 0.75rem;
  position: relative;
}
main .page_navigation > a:hover,
.page_navigation > a.active_page {
  background-color: #eceeef;
  border-color: #ddd;
  color: #014c8c;
  text-decoration: none;
}

.buttons {
  position: relative;
  overflow: hidden;
  font-size: 18px;
  line-height: 18px;
  color: #fff;
  display: inline-block;
  padding: 10px 15px;
  border-radius: 5px;
  background: #096cfe;
  min-width: 150px;
  text-align: center;
}
.buttons:hover{
  background: #DF8402;
  color: #fff!important;
}

/*------------------------------------header------------------------------------*/
#top{
  background: url(../images/common/header.jpg)no-repeat center center;
}
#top p{
  margin:0;
  color: #fff;
  padding:15px 0;
}

#nav-bar {
  padding: 15px 0;
}
#nav-bar nav a#pull {
  display: none;
}
nav ul {
  margin: 0;
  padding: 0;
}
nav ul li {
  display: inline-block;
  vertical-align: middle;
}
nav ul li a {
  padding:0 15px;
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2
}
nav ul li.active-menu a,
nav ul li a:hover {
  color: #096cfe;
}

/*sub-menu*/
.dropdown .dropbtn {
  font-size: 16px;
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content li{
  display: block;
  padding:10px 0;
  text-align: left;
}

/* Add a grey background color to dropdown links on hover */


/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block;
}

/*------------------------------------banner------------------------------------*/
#banner {
  background: url(../images/common/banner.jpg)no-repeat center center;
  padding: 95px 0;
}

.slider-item {
  display:flex!important; 
  justify-content: space-between;
  align-items: center;
  width: 100%!important;
  clear:both; 
  color: #fff;
}
.slider-item .text-item {
  padding:0 40px;
  text-align: left;
}
.slider-item .text-item h2 {
  font-size: 30px;
} 
.slider-item .text-item span{
  display: block;
  font-size: 20px;
}

/*------------------------main------------------------*/
main h1, main h2, #ctc-info h2{
  font-size: 40px;
  color: #0C0BFF;
}
main p a{
  color: #0D6CFE;
}
main p a:hover{
  font-weight: 600;
}

#welcome{
  padding:50px;
}

/*activities*/
#activities{
  background: url(../images/content/activities.jpg)no-repeat;
  padding:50px 0;
  color: #000;
  text-align: left;
}
#activities .row{
  background:rgb(255,255,255);
  background: rgba(255,255,255,0.9);
  padding:20px 10px;
  box-sizing: border-box;
  border-radius: 5px;
  box-shadow: 5px 5px 2px 0px rgb(9 108 254 / 20%);
}
#activities .flex{
  align-items: flex-start;
}
#activities .col span{
  display: block;
}
#activities .col span span{
  display: inline-block;
  color: #096cfe;
}

/*whatWedo*/
#whatWedo{
  padding:50px 0;
}
#whatWedo .stacked{
  position: relative;
  margin:30px auto;
  width: 32%;
}
#whatWedo a{
  position: absolute;
  content:'';
  bottom:4px;
  left:0;
  right:0;
  font-size: 30px;
  font-weight: 600;
  background: rgb(0,0,0);
  background: rgba(0,0,0,0.5);
  color: #fff;
  padding:5px;
  margin:0 auto;
}
#whatWedo a span{
  display: block;
}
#whatWedo a:hover{
  color: #0D6CFE;
  background: #fff;
}

/*statement*/
#statement{
  background: rgb(227,227,227);
  background: linear-gradient(180deg, rgba(227,227,227,0.5) 0%, rgba(255,255,255,1) 100%);
  padding:50px 0;
}



/*------------------------social media------------------------*/
#footer .socials{
  padding:60px 0 50px;
}
#footer .socials a{
  font-family: 'socialico';
  font-size: 23px;
  background: #fff;
  padding:5px 6px;
  border-radius: 50%;
  margin:0 20px;
}
#footer .socials a:first-of-type{
  padding:5px 10px;
}

/*------------------------------------footer------------------------------------*/
#ctc-info{
  padding:50px 0;
}
#ctc-info .row{
  max-width: 1200px;
}
#ctc-info .text-holder{
  text-align: left;
  flex-basis: 600px;
}
#ctc-info .socials{
  font-family: 'socialico';
  font-size: 30px;
  color: #fff;
  padding:5px 10px;
  border-radius: 50%;
  margin:0 20px;
  background: #0C0DF5;
}
#ctc-info .socials:hover{
  background: #096cfe;
}
#ctc-info .map{
  flex-basis: 540px;
}
#ctc-info .map iframe{
  max-width: 100%;
  width: 100%;
  height: 250px;
}
#ctc-info p a:hover{
  color: #096cfe;
  font-weight: 600;
}

/*footer nav*/
#ft-nav{
  background: rgb(227,227,227);
  background: linear-gradient(180deg, rgba(227,227,227,0.5) 0%, rgba(255,255,255,1) 100%);
  padding: 15px 0;
}
#ft-nav .dropdown{
  position: relative;
}
#ft-nav .dropdown-content{
  bottom:23px;
  min-width: 300px;
}

/*------------------------------------Inner------------------------------------*/
.inner main {
  background: rgb(227,227,227);
  background: linear-gradient(180deg, rgba(227,227,227,0.5) 0%, rgba(255,255,255,1) 100%);
  padding:50px 0;
  min-height: 400px;
  padding: 40px 0 0;
}
.inner main .box{
  background:rgb(255,255,255);
  background: rgba(255,255,255,0.9);
  padding:10px 0;
  border-radius: 5px;
  box-shadow: 0px 0px 5px 0px rgba(17,0,136,0.75);
 -webkit-box-shadow: 0px 0px 5px 0px rgba(17,0,136,0.75);
 -moz-box-shadow: 0px 0px 5px 0px rgba(17,0,136,0.75);
  padding:30px;
  margin:30px auto;
}
.inner main h3{
  font-size: 25px;
  color:#096cfe;
  text-align: left;
}
.inner main .caption{
  font-style: italic;
  font-weight: 600;
  margin:0;
  display: block;
}
.inner main p{
  text-align: justify;
}
.inner main ul > *{
  text-align: left;
  margin:10px 0;
}
.inner main .text-holder{
  flex-basis: 500px;
}
.inner #swat img{
  max-width: 560px;
  margin-bottom: 10px;
}
.inner main .image-holder{
  float:right;
  padding:0px 0 10px 15px;
}

.inner main .box:nth-child(even) .image-holder{
  float:left;
  padding:0px 20px 10px 0px;
}

/*testimonies*/
.testimonies-page main .box{
  min-height: 600px;
}

/*events*/
.events-page main iframe{
  width: 60%;
}

/*ministries*/
button.accordion {
  background-color: #096cfe;
  color: #fff;
  cursor: pointer;
  padding: 10px 15px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
  font-size: 20px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

button.accordion.active, button.accordion:hover {
  background-color: #eee;
  color:#096cfe;
  border-bottom-style: solid;
  border-bottom-width: 1px;
}

button.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #777;
  float: right;
  margin-left: 5px;
}

button.accordion.active:after {
  content: "\2212";
}

.ministries-page div.box {
  padding: 18px!important;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  margin:0 auto!important;
  display: none;
}
/*missions*/
.missions-page h2{
  font-size: 30px;
}
.section{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 20vh;
}

.section div{
  margin-top: 10vh;
  max-width: 45%; 
}

.section div h3, .section div p{
  margin-bottom: 1em;
  text-justify: none;
}

.section div img{
  height: max-content;
  width: 100%;
  display: flex;
  margin-top: 4em;
}

/*privacy policy*/
.inPrivacyBox {
  max-width: 850px;
  margin: 0 auto;
}
.inPrivacyBox p {
  text-align: justify !important;
}

/** Responsive
-------------------------------------------------------*/
/*@media screen and (max-width: 1024px){
	body {min-width: 320px}
  #whatWedo a{font-size: 22px;}
  #statement figure{margin:0 15px;}
}

@media screen and (max-width: 768px){
	#top{margin-top: 30px;}
	#nav-bar {padding: 0}
	#nav-bar .row {width: 100%;display: block;}
  #nav-bar img{margin:20px auto;}
	#nav-bar nav {display:block; height: auto; position: fixed; z-index: 999;top:0}
    #nav-bar nav ul { width: 100%; display: none; height: auto;border-bottom:5px solid #000; padding: 0 15px;  background: #fff;position: relative;top:30px;}
  	#nav-bar nav ul li { width: 100%;position: relative; }
  	#nav-bar nav ul li a { display: block; float:none; padding: 10px 0;}
  	#nav-bar nav a {text-align: left; width: 100%;}
  #nav-bar nav a strong {position: absolute; top: 50%; transform: translateY(-50%); left: 15px;}
	#nav-bar nav a#pull {display: block; color: #fff; background-color: #DF8402; height: 30px;padding: 10px 0; width: 100%; position: fixed;}
	#nav-bar nav a#pull:after { content:""; background: url('../images/nav-icon.png') no-repeat; width: 20px; height: 20px; display: inline-block; position: absolute; right: 15px; top: 50%; transform: translateY(-50%);}
	.cta{background: #035B96  url("../images/common/phonecall.png") no-repeat center center;border-bottom-left-radius: 40px;border-top: 2px solid #013f9a ;border-top-left-radius: 40px;bottom: 1%;display: block;height: 80px;position: fixed;right: 0;text-decoration: none; text-indent: -9999em;width: 100px;z-index: 999;}

  #banner{padding:10px 0;}
  #banner .slider-item{flex-direction: column-reverse;}
  .slider-item .text-item{text-align: center;}
  .slider-item .text-item h2{font-size: 20px;}
  #ctc-info .flex{display: block;}
}
@media screen and (max-width: 700px){
  main h1, main h2, #ctc-info h2{font-size: 25px;}
  #activities .flex{display: block;}
  #whatWedo .flex{display: block;}
  #whatWedo .stacked{width: 95%;}
  #statement .flex{display: block;}
  #statement figure{margin:15px auto;}
  #ctc-info .text-holder{text-align: center;}
}
*/