/*
Template Name: NewsFeed
Template URI: http://www.wpfreeware.com/newsfeed-ultra-responsive-news-magazine-theme/
Author: WpFreeware
Author URI: http://www.wpfreeware.com
Description: A Pro bootstrap html5 css3 responsive news magazine website template
Version: 1.0 
License: GPL
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* primary-color #5FBAF5 */
/* secondary-color #F59A5F */

:root {
  --primary-color: #5FBAF5;
  --primary-color-light: #9FD6F9;
  --secondary-color: #F59A5F;
  --secondary-color-light: #F59A5F40;
}

body {
  /* background: #f5f5f5; */
  background: white;
  overflow-x: hidden;
  font-family: "Montserrat", sans-serif;
}

ul {
  padding: 0;
  margin: 0;
  list-style: none
}

a {
  text-decoration: none;
  color: #2f2f2f
}

a:hover {
  color: var(--primary-color);
  text-decoration: none
}

a:focus {
  outline: none;
  text-decoration: none
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Oswald', sans-serif
}

h2 {
  line-height: 40px;
}

img {
  border: none
}

img:hover {
  opacity: 0.75
}

.img-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center
}

.img-right {
  display: block;
  margin-left: auto
}

.img-left {
  display: block;
  margin-right: auto
}

.yellow_bg {
  background-color: #ffd62c
}

.btn-yellow {
  background-color: #ffd62c;
  color: #fff
}

.btn-yellow:hover {
  background-color: #e1b70b;
  color: #fff
}

.limeblue_bg {
  background-color: #7dc34d
}

.blue_bg {
  background-color: #09c
}

.btn {
  border-radius: 0;
  margin-bottom: 5px;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.btn:hover {}

.btn-red {
  background-color: red;
  color: #fff
}

.btn-red:hover {
  background-color: #c40505;
  color: #fff
}

.btn-green {
  background-color: green;
  color: #fff
}

.btn-green:hover {
  background-color: #0ab20a;
  color: #fff
}

.btn-black {
  background-color: black;
  color: #fff
}

.btn-black:hover {
  background-color: #413a3a;
  color: #fff
}

.btn-orange {
  background-color: orange;
  color: #fff
}

.btn-orange:hover {
  background-color: #f09d05;
  color: #fff
}

.btn-blue {
  background-color: blue;
  color: #fff
}

.btn-blue:hover {
  background-color: #0707a2;
  color: #fff
}

.btn-lime {
  background-color: lime;
  color: #fff
}

.btn-lime:hover {
  background-color: #05ae05;
  color: #fff
}

.default-btn {
  background-color: #12a3df;
  color: #fff
}

.default-btn:hover {
  background-color: #0a8ec4;
  color: #fff
}

.btn-theme {
  background-color: #d083cf;
  color: #fff
}

.btn-theme:hover {
  background-color: #ce39cc;
  color: #fff
}

.transition {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  z-index: 99999
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  top: 50%;
  background-image: url(images/status.gif);
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px
}

.scrollToTop {
  border-radius: 25px;
  background-color: var(--secondary-color);
  bottom: 105px;
  display: none;
  font-size: 32px;
  font-weight: bold;
  height: 50px;
  position: fixed;
  right: 75px;
  text-align: center;
  text-decoration: none;
  width: 50px;
  z-index: 9;
  border: 1px solid;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.scrollToTop:hover,
.scrollToTop:focus {
  text-decoration: none;
  outline: none
}

#header {
  display: inline;
  float: left;
  width: 100%;
  background-color: var(--primary-color);
}

.main-container {
  overflow-x: hidden;
}

.header_top {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0 30px;
  line-height: 44px;
  width: 100%
}

.header_top_left {
  float: left;
  display: inline;
  width: 50%
}

.top_nav {
  text-align: left
}

.top_nav li {
  display: inline-block
}

.top_nav li a {
  display: inline-block;
  border-right: 1px solid #333;
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  padding: 5px 15px;
  text-transform: uppercase;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.top_nav li a:hover {
  background-color: #d083cf
}

.header_top_right {
  width: 50%;
  text-align: right;
}

.header_top_right > p {
  color: #fff;
  font: bold 16px sans-serif;
  margin-bottom: 0;
  padding-bottom: 5px;
  padding-right: 5px;
  padding-top: 5px
}

.header_bottom {
  background-color: #fff;
  display: inline;
  float: left;
  padding: 15px 30px 15px;
  width: 100%
}

.logo_area {
  display: inline;
  float: left;
  width: 31%
}

.logo {
  font-size: 45px;
  font-weight: bold;
  color: #000;
  font-family: 'Varela', sans-serif
}

.logo img {
  max-width: 100%
}

.logo img:hover {
  opacity: 1
}

.logo>span {
  margin-left: -14px
}

.add_banner {
  float: right;
  width: 1080px;
  height: 90px
}

.add_banner img {
  width: 100%;
  height: 100%
}

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

#bannerSection {
  padding: 0 0 3vh 0;
  width: 100%;
  display: inline-block;
  text-align: center;
}
.banner-image {
  background-image:
  linear-gradient(to left, rgba(245, 246, 252, 0), var(--primary-color-light)),
  url('https://res.cloudinary.com/dtxfkulxg/image/upload/v1729073065/Pupils_po3ylj.jpg');
  width: 100%;
  height: 850px;
  background-size: cover;
  color: white;
  padding: 20px;
}

.banner-image h1 {
  position: absolute;
  text-align: left;
  left: 10;
  top: 40%;
  color: black;
  font-weight: 700;
  width: 30%;
}
#navArea {
  float: left;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  width: 100%;
  padding: 0 30px;
  background-color: #fff;
  /* box-shadow: 0px 3px 9px -1px rgba(0,0,0,0.54);
  -webkit-box-shadow: 0px 3px 9px -1px rgba(0,0,0,0.54);
  -moz-box-shadow: 0px 3px 9px -1px rgba(0,0,0,0.54); */
}

#navArea:first-child {
  width: 30px;
  height: 30px;
  background-color: slategrey;
}

.navbar {
  border: medium none;
  border-radius: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 0 !important;
}

.navbar-nav>li>a {
  font-size: 15px;
}

.navbar-nav>li>a.primary-action,
.single_sidebar > a.primary-action,
.landingArticle > a.primary-action,
.landingVideo > .videoSection > .videoSectionRow > a.primary-action,
.aboutVideo > .videoSection > .singleVideo > a.primary-action,
.ways__upper_right_donation > div > a.primary-action {
  background-color: var(--secondary-color);
  border: 1px var(--secondary-color) solid;
  color: #000;
  font-weight: 600;
  border-radius: 15px;
  text-align: center;
}

.single_sidebar > a.primary-action,
.landingArticle > a.primary-action {
  padding: 10px;
  margin-bottom: 10px;
}

.landingArticle > a.primary-action,
.landingVideo > .videoSection > .videoSectionRow > a.primary-action,
.aboutVideo > .videoSection > .singleVideo > a.primary-action,
.ways__upper_right_donation > div > a.primary-action {
  padding: 10px 25px;
  max-width: 30%;
}

.aboutVideo > .videoSection > .singleVideo {
  height: 500px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
/* .landingArticle > a.primary-action {
  margin-top: 50px;
} */
.landingVideo > .videoSection > .videoSectionRow > a.primary-action,
.ways__upper_right_donation > a.primary-action {
  margin-top: 40px;
}

.navbar-nav>li>a.primary-action:hover,
.single_sidebar > a.primary-action:hover,
.landingArticle > a.primary-action:hover,
.landingVideo > .videoSection > .videoSectionRow > a.primary-action:hover,
.ways__upper_right_donation > div > a.primary-action:hover {
  border: 1px var(--secondary-color) solid;
  color: var(--primary-color);
  font-weight: 600;
  background-color: white;
  text-align: center;
  border-radius: 15px;
}

.navbar-inverse .navbar-nav>li>a {
  border-left: 1px solid #383838;
  color: #ddd;
  font-family: 'Oswald', sans-serif;
  display: inline-block;
  height: 50px;
  line-height: 50px;
  padding: 0 14px;
  text-shadow: 0 1px 1px #000;
  text-transform: uppercase;
  -webkit-transition: all 0.5s;
  -mz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.navbar-inverse .navbar-nav>li:first-child a {
  border: none
}

.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a:focus {
  color: #fff
}

.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:hover,
.navbar-inverse .navbar-nav>.active>a:focus {
  color: #fff
}

.main-nav ul li a {}

.navbar-collapse {
  padding-left: 0
}

.mobile-show {
  display: none
}

.desktop-home {
  display: block;
  font-size: 30px;
  margin-top: 10px
}

.dropdown-menu {
  background-color: #222
}

.dropdown-menu>li>a {
  clear: both;
  color: #ddd;
  background-color: #222;
  padding: 10px 20px;
  font-family: 'Oswald', sans-serif;
  -webkit-transition: all 0.5s;
  -mz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
  color: #fff
}

.mission_slider {
  padding: 0 30%;
  margin: 70px 0;
}
#aboutUs{
  position: relative;
  padding-bottom: 100px;
}
#aboutUs::before {   
  content: "";
  width: 100%;
  height: 168px;
  position: absolute;
  bottom: -0.3%;
  left: 0;
  background-size: auto;
  background-repeat: repeat no-repeat;
  background-position: 76vw bottom;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 1200  88' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 64L50 60C100 57 200 49 300 33C400 17 500 -7 600 1C700 9 800 49 900 64C1000 80 1100 72 1150 68L1200 64V88H1150C1100 88 1000 88 900 88C800 88 700 88 600 88C500 88 400 88 300 88C200 88 100 88 50 88H0V64Z' fill='%23e5e5e5'/></svg>");
}

.about_us_content h2,
#sliderSection h2,
.mission_slider .mission_slide h2 {
  color: var(--primary-color);
  font-family: 'Oswald', sans-serif;
  /* font-size: 18px; */
  font-weight: 400;
  margin-bottom: 10px;
  margin-left: 0;
  margin-top: 5px;
  padding: 0;
  position: relative;
  text-align: center;
  text-transform: uppercase;
}

.mission_slider .mission_slide p {
  font-size: 20px;
  margin-top: 60px;
  text-align: center;
}

.centre-container {
  margin-top: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.about_us_nav {
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 80px 15% 0;
}


.about_us_nav li:not(:first-child)  {
  margin-left: 20px;
  margin-bottom: 30px;
}

.about_us_nav .media .image-left img {
  width: 30px;
  height: 30px;
}
.about_us_nav .media {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 240px;
}

.about_us_nav .media .media-body{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}
.about_us_nav .media .media-body a {
  color: var(--secondary-color);
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

#allCentres .single-centre h4 {
  /* border-bottom: 1px solid var(--primary-color-light); */
  color: var(--secondary-color);
  font-weight: 600;
  padding: 10px;
  font-size: 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.about_us_nav .media .media-body p {
  text-align: center;
}

#allCentres .single-centre p,
.landingArticle p {
  font-size: 16px;
  text-align: center;
}

#allCentres {
  text-align: center;
  padding-bottom: 50px;
  width: 70%;
  margin: 0 auto; 
}
.allCentreCont,
.ways__middle_section {  
  background-color: #ffffff;
  position: relative;
  padding: 60px;
}

.allCentreCont::before,
.ways__middle_section::before {   
  content: "";
  width: 100%;
  height: 42px;
  position: absolute;
  bottom: -0.3%;
  left: 0;
  background-size: auto;
  background-repeat: repeat no-repeat;
  background-position: 77vw bottom;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 1200  109' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 80L50 75C100 70 200 60 300 41C400 21 500 -8 600 1C700 11 800 60 900 80C1000 100 1100 90 1150 85L1200 80V110H1150C1100 110 1000 110 900 110C800 110 700 110 600 110C500 110 400 110 300 110C200 110 100 110 50 110H0V80Z' fill='%23ebebeb'/></svg>");
}

@media(max-width:850px) {
  .allCentreCont::before {    
    height: 21px
  }  
}

#allCentres .single-centre p,
.landingArticle p {
  text-align: left;
}

.landingArticle .curvedArticle p,
.landingVideo .videoSection p ,
.approachSection .approachCards .approachCardsRow {
  padding-top: 50px;
}

.approachSection .approachCards .approachCardsRow .card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 330px;
  height: 400px;
  padding: 30px;
  margin-bottom: 20px;
  background-color: whitesmoke;
  border-radius: 20px;
  box-shadow: 2px -6px 55px 3px rgba(0,0,0,0.68);
  -webkit-box-shadow: 2px -6px 55px 3px rgba(0,0,0,0.68);
  -moz-box-shadow: 2px -6px 55px 3px rgba(0,0,0,0.68);
}
.allCentreCont #allCentres .card,
.ways__middle_section #allCentres .card {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 250px;
  padding: 30px;
  border-radius: 20px;
  border: 3px solid whitesmoke;
}
.allCentreCont #allCentres .card:hover,
.ways__middle_section #allCentres .card:hover {
  transform: scale(1.05);
  transition: ease-in-out;
  border: 3px solid var(--primary-color);
}

.approachSection .approachCards .approachCardsRow .card .card-img-top,
.allCentreCont #allCentres .card .card-img-top,
.ways__middle_section #allCentres .card .card-img-top {
  height: 150px;
  padding-bottom: 40px;
}

.landingArticle .curvedArticle h2,
.landingVideo h2 {
  margin-top: 100px;
}

.landingArticle {
  background-color: #e5e5e5;
  text-align: center;
  padding-bottom: 50px;
  /* --mask:
    radial-gradient(24.6vw at 50% 33vw,#000 99%,#0000 101%) calc(50% - 22vw) 0/44vw 100%,
    radial-gradient(24.6vw at 50% -22vw,#0000 99%,#000 101%) 50% 11vw/44vw 100% repeat-x;
  -webkit-mask: var(--mask);
          mask: var(--mask); */
}

.landingArticle .curvedArticle {
  text-align: center;
  margin: 0 auto;
  width: 70%;
  padding: 40px; 
  position: relative;
} 

.historyArticle .curvedArticle {
  text-align: center;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  padding: 120px; 
  position: relative;
} 

.historyArticle {
  background-color: #EBEBEB;
}

.landingVideo,
.approachSection {
  background-color: #cfcfcf;
  text-align: center;
}

.landingVideo .videoSection {
  /* margin: 70px auto; */
  margin-left: auto;
  margin-right: auto;
  width: 70%;
  padding: 80px; 
}
.approachSection .approachCards {
  /* margin: 70px auto; */
  margin-left: auto;
  margin-right: auto;
  width: 90%;
  padding: 80px; 
}

.landingVideo .videoSection .videoSectionRow {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  margin-top: 60px;
}
/*****/
/* ABOUT PAGE */
/*****/

#aboutUsUpper {
  min-height: 80vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#aboutUsUpper .innerSection > div:first-child {
  padding-right: 70px;
}

#aboutUsUpper .innerSection {
  position: relative;
  margin: 40px;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: space-between;
}
#aboutUsUpper .innerSection h2 {
  margin: 0;
}

#aboutUsUpper::before {   
  content: "";
  width: 100%;
  height: 300px;
  position: absolute;
  bottom: -0.3%;
  /* left: 0; */
  background-size: auto;
  background-repeat: repeat no-repeat;
  background-position: 76vw bottom;
  background-image: url("data:image/svg+xml;utf8,<svg viewBox='0 0 1200  88' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M0 64L50 60C100 57 200 49 300 33C400 17 500 -7 600 1C700 9 800 49 900 64C1000 80 1100 72 1150 68L1200 64V88H1150C1100 88 1000 88 900 88C800 88 700 88 600 88C500 88 400 88 300 88C200 88 100 88 50 88H0V64Z' fill='%23e5e5e5'/></svg>");
}

.aboutVideo .videoSection {
  display: flex;
  flex-direction: row;
  align-items: start;
  justify-content: space-between;
}
.aboutVideo .videoSection,
.aboutApproach,
.aboutResults,
.aboutApproachMethods,
.aboutStats,
.aboutValues,
.aboutCommunities,
.aboutTeam,
.aboutStory {
  margin: 70px auto;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
  padding: 80px; 
}

.aboutApproach p,
.aboutResults p {
  margin-top: 40px;
}
.aboutResults {
  border-top: 3px dashed #f09d05;
}
.aboutApproachMethods{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  background-color: #e4e4e4;
}
.aboutApproachMethods > div {
  margin-right: 30px;
}
.aboutStats {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  border-bottom: 3px dashed #f09d05;
}
.aboutStats .counter-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 20%;
}
.aboutStats .counter-cell .count {
  font-size: 28px;
}
.aboutValues .values {
  display: grid;
  grid-template-columns: auto auto auto auto;
  margin-top: 60px;
}
.aboutValues .values span {
  background-color: turquoise;
  min-width: 30px;
  min-height: 50px;
  margin-right: 20px;
  margin-bottom: 20px;
}
.aboutCommunities .aboutSingleCommunity {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.aboutTeam .teamMembers {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 30px;
} 
.aboutTeam {
  background-color: #e4e4e4;
}
.aboutTeam .teamMembers .card {
  width: 30%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 20px;
}
/*********************/
/*        BLOG       */
/*********************/
.blog-container {
  /* background-color: #e1b70b; */
  padding: 30px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  flex-wrap: wrap;
  margin-bottom: 50px;
}
.blog-card {
  width: 27%;
  margin: 25px;
  background-color: #f5f3f3;
  border-radius: 20px;
}
.blog-card > img {
  width: 100%;
}
.blog-card > .blog-card-body {
  padding: 20px;
  text-align: center;
}
.blog-card > .blog-card-body > .primary-action {
  padding: 10px 25px;
  max-width: 30%;
  margin-top: 20px;
}
.blog-card > .blog-card-body > .primary-action {
  background-color: var(--secondary-color);
  border: 1px var(--secondary-color) solid;
  font-weight: 600;
  border-radius: 15px;
  text-align: center;
}
.blog-card > .blog-card-body > a.primary-action:hover {
  border: 1px var(--secondary-color) solid;
  font-weight: 600;
  background-color: white;
  text-align: center;
  border-radius: 15px;
}
.blog-subscription {
  text-align: center;
  width: 100%;
  padding-top: 100px;
  padding-bottom: 100px;
  border-top: 2px solid var(--secondary-color-light);
}
.blog-subscription .subscription-form{
  margin-top: 50px;
}

.blog-subscription .subscription-form .searchInput,
.blog-subscription .subscription-form .searchBtn{
  padding: 10px 20px;
}
/*********************/
/*   WAYS TO GIVE    */
/*********************/

.ways__upper_section {
  margin: 70px auto;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
  padding: 80px; 
  display: flex;
  flex-direction: row;
}

.ways__middle_section p {
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

.ways__upper_section {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 20px 50px;
}

.ways__upper_section p,
.ways__middle_section p {
  font-size: 16px;
  line-height: 30px;
  margin-top: 30px;
}

.ways__upper_left {
  max-width: 55%;
}

.ways__upper_right {
  max-width: 45%;
}

.ways__upper_left_child {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.ways__upper_left_child{
  border: 4px solid var(--secondary-color-light);
  border-radius: 20px;
  margin-top: 30px;
  padding: 20px 40px;
}
.ways__upper_left_donation_methods .methods {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  padding: 10px;
  margin-top: 10px;
}

.ways__upper_right_donation{
  padding-left: 30px;
  text-align: center;
}
.ways__upper_right_donation .amounts {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 40px;
  grid-row-gap: 40px;
}
.ways__upper_right_donation .amounts span {
  border-radius: 15px;
  border: 2px solid var(--secondary-color-light);
  padding: 5px 10px;
}
.ways__input-box {
  margin-top: 20px;
  display: flex; /* Comment: Displays the container as a flex container */
  align-items: center; /* Comment: Aligns items along the cross axis (vertically centered) */
  max-width: 300px; /* Comment: Sets the maximum width of the container */
  background: #CCC; /* Comment: Sets the background color of the container */
  border: 1px solid #a0a0a0; /* Comment: Sets the border of the container */
  border-radius: 15px; /* Comment: Sets the border radius to create rounded corners */
  padding-left: 0.5rem; /* Comment: Adds left padding to the container */
  overflow: hidden; /* Comment: Hides any content that overflows the container */
  font-family: sans-serif; /* Comment: Sets the font family for the text inside the container */
}

.ways__input-box .prefix {
  font-weight: 300; /* Comment: Sets the font weight of the prefix text */
  font-size: 14px; /* Comment: Sets the font size of the prefix text */
  color: #999; /* Comment: Sets the color of the prefix text */
}

.ways__input-box input {
  flex-grow: 1; /* Comment: Allows the input field to grow to fill remaining space */
  font-size: 14px; /* Comment: Sets the font size of the input text */
  background: #fff; /* Comment: Sets the background color of the input field */
  border: none; /* Comment: Removes the border of the input field */
  outline: none; /* Comment: Removes the outline when input field is focused */
  padding: 0.5rem; /* Comment: Adds padding to the input field */
}

.ways__input-box:focus-within {
  border-color: #777; /* Comment: Changes the border color when the container or its children are focused */
}

.ways__middle_section {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  padding: 20px 50px;
  margin-top: 70px;
}
.ways__lower_section {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  padding: 20px 50px;
  margin: 70px auto;
}

.ways__lower_section #chartContainer .canvasjs-chart-credit{
  display: none;
}

@media(max-width:767px) {
  .ways__upper_section {
    flex-direction: column;
    padding: 20px;
  }
  .ways__upper_left {
    max-width: 100%;
    margin-bottom: 30px;
  }
  .ways__upper_right_donation .amounts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 40px;
    grid-row-gap: 40px;
  }
}

/*******************************/
/* Background Square Animation */
/*******************************/

.hero {
  /* background-color: #0040C1; */
  position: relative;
  height: 50vh;
  width: 350px;
  /* overflow: hidden; */
}

.hero__title {
  color: #fff;
  position: absolute;
  top: 5px;
  left: 5px;
  font-size: 50px;
  z-index: 1;
}

.cube {
  position: absolute;
  top: 8px;
  left: 4px;
  width: 10px;
  height: 10px;
  /* border: solid 1px #0ac10080; */
  transform-origin: top left;
  transform: scale(0) rotate(0deg) translate(50px, 50px);
  animation: cube 12s ease-in forwards infinite;
}
  
.cube:nth-child(2n) {
  border-color: #c18e0050;
}

.cube:nth-child(2) {
  animation-delay: 2s;
  left: 150px;
  top: 100px;
  transform-origin: bottom left;
  background-color: #00acee;
  animation: cube-opp 12s ease-in forwards infinite;
}

.cube:nth-child(3) {
  animation-delay: 4s;
  right: 75px;
  top: 30px;
  transform-origin: top right;
  background-color: #c40505;
}

.cube:nth-child(4) {
  animation-delay: 4s;
  right: 90px;
  top: 100px;
  transform-origin: bottom right;
  background-color: #e33b7e;
  animation: cube-opp 12s ease-in forwards infinite;
}

.cube:nth-child(5) {
  animation-delay: 8s;
  left: 10px;
  top: 8.5px;
  transform-origin: top right;
  background-color: #f09d05;
  animation: cube-vrt 12s ease-in forwards infinite;
}

.cube:nth-child(6) {
  animation-delay: 10s;
  left: 80px;
  bottom: 10px;
}


@keyframes cube {
  from {
    transform: scale(0) rotate(0deg) translate(-50px, -50px);   
    opacity: 1;
  }
  to {
    transform: scale(10) rotate(60deg) translate(50px, 50px); 
    opacity: 0;
  }
}
@keyframes cube-opp {
  from {
    transform: scale(0) rotate(0deg) translate(-50px, -50px);   
    opacity: 1;
  }
  to {
    transform: scale(10) rotate(-60deg) translate(50px, 50px); 
    opacity: 0;
  }
}

@keyframes cube-vrt {
  from {
    transform: scale(0) rotate(0deg) translate(-50px, 50px);   
    opacity: 1;
  }
  to {
    transform: scale(10) rotate(0deg) translate(50px, 50px); 
    opacity: 0;
  }
}
/************************/
/*     Testimonials     */
/************************/
.slider-1 {
	padding-top: 8rem;
	padding-bottom: 8rem;
	text-align: center;
	overflow-x: hidden;
}

.slider-1 .slider-container {
	position: relative;
}

.slider-1 .swiper-container {
	position: static;
	width: 88%;
	text-align: center;
}

.slider-1 .swiper-button-prev:focus,
.slider-1 .swiper-button-next:focus {
	/* even if you can't see it chrome you can see it on mobile device */
	outline: none;
}

.slider-1 .swiper-button-prev {
	left: -10px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 18px 28px;
}

.slider-1 .swiper-button-next {
	right: -10px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 18px 28px;
}

.slider-1 .card {
	position: relative;
	border: none;
	background-color: transparent;
}

.slider-1 .card-image,
.aboutTeam .card-image {
	width: 96px;
	height: 96px;
	margin-right: auto;
	margin-bottom: 1.5rem;
	margin-left: auto;
	border-radius: 50%;
}

.slider-1 .card-body,
.aboutTeam .card-body {
	padding: 0;
}

.slider-1 .testimonial-author,
.aboutTeam  .testimonial-author {
	margin-bottom: 0;
}
.testimonials {
  margin: 60px auto;
}
.slider-container {
  margin: 80px auto;
}

.imageContainer {
  display: flex;
  flex-direction: row;
}
.imageContainer img {
  height: 180px;
  width: 20%;
}
/************************/
/*     Encouraging Stories     */
/************************/
.slider-2 {
	padding-top: 8rem;
	padding-bottom: 8rem;
	text-align: center;
	overflow-x: hidden;
}

.slider-2 .slider-container {
	position: relative;
}

.slider-2 .swiper-container {
	position: static;
	width: 88%;
	text-align: center;
}

.slider-2 .swiper-button-prev:focus,
.slider-2 .swiper-button-next:focus {
	/* even if you can't see it chrome you can see it on mobile device */
	outline: none;
}

.slider-2 .swiper-button-prev {
	left: -10px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 18px 28px;
}

.slider-2 .swiper-button-next {
	right: -10px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2028%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
	background-size: 18px 28px;
}

.slider-2 .card {
	position: relative;
	border: none;
  width: 330px;
  min-height: 350px;
  padding: 20px;
  border-radius: 10px;
	background-color: transparent;
  box-shadow: -1px 1px 19px -2px rgba(0,0,0,0.75);
-webkit-box-shadow: -1px 1px 19px -2px rgba(0,0,0,0.75);
-moz-box-shadow: -1px 1px 19px -2px rgba(0,0,0,0.75);
}

.slider-2 .card-image {
	width: 100%;
	height: 200px;
	margin-right: auto;
	margin-bottom: 1.5rem;
	margin-left: auto;
}

.slider-2 .card-body {
	padding: 0;
}

.slider-2 .testimonial-author {
	margin-bottom: 0;
}
.testimonials {
  margin: 60px auto;
}
.slider-container {
  margin: 80px auto;
}

.imageContainer {
  display: flex;
  flex-direction: row;
}
.imageContainer img {
  height: 180px;
  width: 20%;
}
/**********************/
/*     Statistics     */
/**********************/
.counter {
	padding-top: 14.25rem;
	padding-bottom: 14.25rem;
	text-align: center;
}

.counter .counter-cell {
	display: inline-block;
	width: 20%;
	margin: 4rem 1.75rem;
	vertical-align: top;
}

.counter .fas {
	margin-bottom: 2rem;
	font-size: 2.25rem;
	color: #00c9db;
}

.counter .purecounter {
	margin-bottom: 1.125rem;
	font-weight: 700;
	font-size: 4.25rem;
	line-height: 2.5rem;
	font-family: "Montserrat", sans-serif;
}

.counter .counter-info {
	font-size: 12px;
	line-height: 1.5rem;
  margin-top: 20px;
}

#newsSection {
  float: left;
  display: inline;
  width: 100%;
  padding: 0 30px;
  background-color: #fff;
  padding-bottom: 20px;
}

.left_content .leaders-table {
  background-color: #00acee;
  margin-top: 100px;
}

.left_content table tbody tr td{
  padding: 10px;
  margin: 10px auto;
}

.latest_newsarea {
  float: left;
  display: inline;
  width: 100%;
  background-color: #00C;
  position: relative
}

.latest_newsarea span {
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: 15px;
  left: 0;
  line-height: 1.8em;
  margin-right: 20px;
  overflow: hidden;
  padding: 2px 18px 1px 19px;
  position: absolute;
  z-index: 15
}

.social_area {
  position: absolute;
  right: 0;
  top: 0;
  background: #fff;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
  height: 31px
}

.social_nav {
  text-align: right
}

.social_nav li {
  display: block;
  float: left
}

.social_nav li a {
  display: block;
  float: left;
  height: 30px;
  text-indent: -9999px;
  width: 30px;
}

.social_nav li.facebook a {
  background-image: url("images/socials.png");
  background-position: 0 -30px;
  background-size: 270px 60px;
  background-color: #436eac
}

.social_nav li.facebook a:hover {
  background-position: 0 0px;
  background-size: 270px 60px;
  /* background-color: #436eac */
}

.social_nav li.twitter a {
  background-image: url("images/socials.png");
  background-position: -30px -30px;
  background-size: 270px 60px;
  background-color: #0598c9
}

.social_nav li.twitter a:hover {
  background-position: -30px 0px;
  background-size: 270px 60px;
  /* background-color: #0598c9 */
}

.social_nav li.flickr a {
  background-image: url("images/socials.png");
  background-position: -60px -30px;
  background-size: 270px 60px
}

.social_nav li.flickr a:hover {
  background-position: -60px 0px;
  background-size: 270px 60px;
  background-color: #e33b7e
}

.social_nav li.pinterest a {
  background-image: url("images/socials.png");
  background-position: -90px -30px;
  background-size: 270px 60px
}

.social_nav li.pinterest a:hover {
  background-position: -90px 0px;
  background-size: 270px 60px;
  background-color: #cb2027
}

.social_nav li.googleplus a {
  background-image: url("images/socials.png");
  background-position: -120px -30px;
  background-size: 270px 60px
}

.social_nav li.googleplus a:hover {
  background-position: -120px 0px;
  background-size: 270px 60px;
  background-color: #d64b2e
}

.social_nav li.vimeo a {
  background-image: url("images/socials.png");
  background-position: -150px -30px;
  background-size: 270px 60px
}

.social_nav li.vimeo a:hover {
  background-position: -150px 0px;
  background-size: 270px 60px;
  background-color: #86ae24
}

.social_nav li.youtube a {
  background-image: url("images/socials.png");
  background-position: -180px -30px;
  background-size: 270px 60px;
  width: 60px
}

.social_nav li.youtube a:hover {
  background-position: -180px 0px;
  background-size: 270px 60px;
  background-color: #e32114
}

.social_nav li.mail a {
  background-image: url("images/socials.png");
  background-position: -240px -30px;
  background-size: 270px 60px;
  width: 32px
}

.social_nav li.mail a:hover {
  background-position: -240px 0px;
  background-size: 270px 60px;
  background-color: #bc75d6
}

#sliderSection {
  width: 80%;
  margin: 0 auto;
  padding: 0;
  min-height: 600px;
}

#sliderSection .slick_slider {
  margin: 100px auto;
}

.single_iteam {
  display: inline;
  float: left;
  position: relative;
  width: 100%;
  height: 640px;
}

.single_iteam img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.single_iteam img:hover {
  opacity: 1
}

.slider_article {
  bottom: 20px;
  left: 0;
  position: absolute;
  right: 0;
  padding: 10px 15px
}

.slider_article>h2 a {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
  color: #fff;
  font-size: 18px;
  padding: 10px;
  display: inline-block
}

.slider_article>p {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
  color: #fff;
  padding: 3px;
  display: inline-block
}

.slick-prev:before {
  content: ""
}

.slick-prev {
  background-image: url(images/slider_prev.png);
  background-repeat: no-repeat;
  background-position: center;
  left: -50px;
}

.slick-next:before {
  content: ""
}

.slick-next {
  background-image: url(images/slider_next.png);
  background-repeat: no-repeat;
  background-position: center;
  right: -60px;
}

.slick-prev,
.slick-next {
  background-color: #000;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.slick-prev:hover,
.slick-next:hover {
  opacity: 0.5
}

.latest_post {
  float: left;
  display: inline;
  width: 100%
}

.latest_post>h2 {
  background: none repeat scroll 0 0 rgb(217, 255, 0);
  color: #fff;
  font-family: 'Oswald', sans-serif;
  font-size: 18px;
  margin-top: 5px;
  font-weight: 400;
  margin-bottom: 10px;
  margin-left: 0;
  padding: 0;
  position: relative;
  text-align: center;
  text-transform: uppercase
}

.latest_post>h2 span {
  padding: 4px 10px
}

.latest_postnav {
  height: auto !important;
  margin-top: 20px
}

.latest_postnav li {
  margin-bottom: 10px;
  float: left;
  width: 100%
}

.latest_post_container {
  display: inline;
  float: left;
  height: 430px;
  position: relative;
  width: 100%
}

.latest_post_container:hover #prev-button,
.latest_post_container:hover #next-button {
  display: block
}

#prev-button {
  cursor: pointer;
  font-size: 20px;
  left: 0;
  position: absolute;
  text-align: center;
  top: -10px;
  width: 100%;
  display: none
}

#next-button {
  cursor: pointer;
  display: none;
  font-size: 20px;
  left: 0;
  position: absolute;
  text-align: center;
  bottom: 0;
  width: 100%
}

#contentSection {
  float: left;
  display: inline;
  width: 100%;
  background-color: #fff;
  padding: 0 30px
}

.left_content {
  /* float: left;
  display: inline; */
  width: 70%;
  margin: 0 auto;
}

.single_post_content {
  /* float: left;
  display: inline; */
  width: 100%;
  margin-bottom: 20px
}

.single_post_content>h2,
.single_sidebar > h2 {
  color: #d083cf;
  font-family: 'Oswald', sans-serif;
  font-size: 22px;
  font-weight: 400;
  margin-bottom: 10px;
  margin-left: 0;
  margin-top: 5px;
  padding: 0;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 20px
}

.single_post_content>h2 span {
  padding: 4px 10px
}

.single_post_content_left {
  float: left;
  display: inline;
  width: 49%
}

.business_catgnav {}

.business_catgnav li {
  float: left;
  display: block;
  width: 100%
}

.bsbig_fig {
  width: 100%
}

.bsbig_fig>a {
  display: block
}

.bsbig_fig>a img {
  width: 100%
}

.bsbig_fig figcaption {
  color: #333;
  font-family: "Oswald", sans-serif;
  font-size: 23px;
  font-weight: 300;
  margin-top: 10px;
  margin-bottom: 10px
}

.single_post_content_right {
  float: right;
  display: inline;
  width: 48%
}

.right_content {
  width: 70%;
  margin: 0 auto;
  min-height: 300px
}

.spost_nav li {
  float: left;
  display: block;
  width: 100%;
  margin-bottom: 10px
}


.spost_nav .media-left {
  width: 100px;
  height: 80px
}

.media-left>img {
  height: 70px;
  width: 90px;
}

.spost_nav .media-body>a {
  font-family: "Oswald", sans-serif
}

.featured_img {
  position: relative
}

.overlay:hover {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4)
}

.overlay {
  bottom: 0;
  display: block;
  left: 0;
  position: absolute;
  width: 100%;
  z-index: 2;
  height: 100%;
  -webkit-transition: all 0.5s;
  -mz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.fashion_technology_area {
  display: inline;
  float: left;
  width: 100%
}

.fashion {
  float: left;
  display: inline;
  width: 48%
}

.technology {
  float: right;
  display: inline;
  width: 48%
}

.photo_grid {
  position: relative;
  margin: 0 auto;
  max-width: 1000px;
  list-style: none;
  text-align: center
}

.photograph_nav {
  margin-left: -11px
}

.photograph_nav li {
  display: block;
  float: left;
  margin-left: 9px;
  width: 32%
}

.photo_grid figure {
  position: relative;
  float: left;
  overflow: hidden;
  margin: 10px 1%;
  margin-top: 0;
  height: 150px;
  width: 100%;
  background: #3085a3;
  text-align: center;
  cursor: pointer
}

.photo_grid figure img {
  position: relative;
  display: block;
  min-height: 100%;
  max-width: 100%;
  width: 100%;
  height: 100%;
  opacity:0.8
}

.photo_grid figure figcaption {
  padding: 2em;
  color: #fff;
  text-transform: uppercase;
  font-size: 1.25em;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

.photo_grid figure figcaption::before,
.photo_grid figure figcaption::after {
  pointer-events: none
}

.photo_grid figure figcaption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%
}

.photo_grid figure h2 {
  word-spacing: -0.15em;
  font-weight: 300
}

.photo_grid figure h2 span {
  font-weight: 800
}

.photo_grid figure h2,
.photo_grid figure a {
  margin: 0
}

.photo_grid figcaption a {
  color: #fff;
  font-size: 68.5%;
  letter-spacing: 1px;
  display: block;
  margin-top: 7px
}

figure.effect-layla img {
  height: 390px
}

figure.effect-layla figcaption {
  padding: 1.5em
}

figure.effect-layla figcaption::before,
figure.effect-layla figcaption::after {
  position: absolute;
  content: '';
  opacity: 0
}

figure.effect-layla figcaption::before {
  top: 20px;
  right: 15px;
  bottom: 20px;
  left: 15px;
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: scale(0, 1);
  transform: scale(0, 1);
  -webkit-transform-origin: 0 0;
  transform-origin: 0 0
}

figure.effect-layla figcaption::after {
  top: 9px;
  right: 25px;
  bottom: 9px;
  left: 25px;
  border-right: 1px solid #fff;
  border-left: 1px solid #fff;
  -webkit-transform: scale(1, 0);
  transform: scale(1, 0);
  -webkit-transform-origin: 100% 0;
  transform-origin: 100% 0
}

figure.effect-layla h2 {
  font-size: 18px;
  padding-top: 33%;
  -webkit-transition: -webkit-transform 0.35s;
  transition: transform 0.35s
}

figure.effect-layla a {
  text-transform: none;
  -webkit-transform: translate3d(0, -10px, 0);
  transform: translate3d(0, -10px, 0)
}

figure.effect-layla img,
figure.effect-layla h2 {
  -webkit-transform: translate3d(0, -30px, 0);
  transform: translate3d(0, -30px, 0)
}

figure.effect-layla img,
figure.effect-layla figcaption::before,
figure.effect-layla figcaption::after,
figure.effect-layla a {
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s
}

figure.effect-layla:hover img {
  opacity: 0.7;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
}

figure.effect-layla:hover figcaption::before,
figure.effect-layla:hover figcaption::after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1)
}

figure.effect-layla:hover h2 {
  padding-top: 26%
}

figure.effect-layla:hover h2,
figure.effect-layla:hover a {
  opacity: 1;
  -webkit-transform: translate3d(0, -35px, 0);
  transform: translate3d(0, -35px, 0)
}

figure.effect-layla:hover figcaption::after,
figure.effect-layla:hover h2,
figure.effect-layla:hover a,
figure.effect-layla:hover img {
  -webkit-transition-delay: 0.15s;
  transition-delay: 0.15s
}

.single_sidebar {
  float: left;
  display: inline;
  width: 100%;
  margin-bottom: 20px
}

.single_sidebar>h2 span {
  padding: 4px 10px
}

.cat-item a {
  background: none repeat scroll 0 0 #e4e4e4;
  color: #888;
  display: block;
  float: left;
  border-bottom: none !important;
  font-size: 13px;
  line-height: 12px;
  margin: 0 2px 2px 0;
  padding: 12px 17px;
  -webkit-transition: all 0.5s;
  -mz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.cat-item a:hover {
  color: #fff;
  text-decoration: none !important
}

.tab-content {
  margin-top: 5px
}

.nav-tabs {
  background: none repeat scroll 0 0 rgb(217, 255, 0);
  border-bottom: none
}

.nav-tabs>li {
  margin-bottom: 0
}

.nav-tabs>li>a {
  margin-right: 0;
  color: #fff;
  font-size: 15px;
  border-radius: 0;
  border: none;
  font-family: "Oswald", sans-serif;
  -webkit-transition: all 0.5s;
  -mz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.nav-tabs>li>a:hover,
.nav-tabs>li>a:focus {
  color: #fff !important;
  border: none
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
  border-width: 0;
  border-color: #ddd #ddd transparent;
  color: #fff
}

.vide_area {
  float: left;
  display: inline;
  width: 100%
}

.sideAdd {
  display: block;
  float: left;
  height: 250px;
  width: 100%;
  margin-top: 10px
}

.sideAdd>img {
  width: 100%;
  height: 100%
}

.single_sidebar ul li a {
  border-bottom: 1px solid #333;
  display: block
}

.single_sidebar .spost_nav li a {
  border-bottom: none;
  float: left
}

#footer {
  width: 100%;
  height: auto;
  background-color: #252525;
}

.footer_top {
  background-color: #252525;
  color: #ddd;
  width: 70%;
  margin: 0 auto;
  padding-bottom: 30px;
}

.footer_top .footer_low {
  padding: 20px;
}

.footer_widget {
  display: inline;
  float: left;
  width: 100%;
  min-height: 310px
}

.footer_widget>h2,
.footer_widget_two > a {
  /* border-bottom: 3px solid #666; */
  font-family: 'Oswald', arial, Georgia, serif;
  font-size: 20px;
  padding: 10px 0;
  text-transform: uppercase
}

.footer_widget_two > a {
  color: white;
}
.footer_widget_two > a:hover{
  color: #bc75d6;
}
.footer_widget_two {
  padding-top: 30px;
}

.tag_nav {}

.tag_nav li {}

.tag_nav li a {
  border-bottom: 1px solid #ddd;
  color: #ccc;
  display: block;
  padding: 6px 6px 6px 0;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.tag_nav li a:hover {
  padding-left: 10px
}

.footer_bottom {
  width: 70%;
  margin: 0 auto;
  background-color: #252525;
  color: #ccc;
}

.copyright {
  float: left;
  width: 50%;
  padding-top: 5px;
  text-align: left
}

.copyright a {
  color: #ccc
}

.developer {
  float: right;
  width: 50%;
  text-align: right;
  padding-top: 5px;
  color: #222
}

.developer a {
  color: #222
}

.catgArchive {
  border: medium none;
  color: #fff;
  display: inline;
  float: left;
  font-weight: bold;
  padding: 10px 15px;
  width: 100%;
  margin-top: 15px
}

.catgArchive option {
  background-color: #fff;
  font-weight: normal;
  padding: 5px;
  color: #d083cf
}

.nav-tabs>li {
  display: inline-block;
  float: none;
  width: 32.55%
}

.nav-tabs {
  text-align: center
}

.pagination>li>a,
.pagination>li>span {
  background-color: #000;
  border: 1px solid #000;
  color: #eee;
  margin-right: 5px;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.pagination>li>a:hover,
.pagination>li>a:focus {
  background-color: #d083cf;
  color: #fff;
  border-color: #d083cf
}

.pagination>li:first-child>a,
.pagination>li:first-child>span {
  border-bottom-left-radius: 0;
  border-top-left-radius: 0
}

.pagination>li:last-child>a,
.pagination>li:last-child>span {
  border-bottom-right-radius: 0;
  border-top-right-radius: 0
}

.single_page {
  float: left;
  display: inline;
  width: 100%;
  min-height: 600px;
}

.single_page>h1 {
  color: #333;
  font-family: Oswald, arial, Georgia, serif;
  font-size: 30px;
  line-height: 1.4em;
  margin: 10px 0 -10px;
  padding: 0 0 4px;
  text-transform: uppercase
}

.post_commentbox {
  display: inline;
  float: left;
  width: 100%;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  margin-top: 20px;
  padding: 5px 0px
}

.post_commentbox a,
.post_commentbox span {
  color: #798992;
  font-size: 11px;
  margin-right: 5px
}

.post_commentbox a>i,
.post_commentbox span>i {
  margin-right: 5px
}

.breadcrumb {
  background-color: #303030;
  border-radius: 0
}

.breadcrumb li a {
  color: #fff
}

.single_page_content {
  padding-top: 20px;
  width: 70%;
  margin: 0 auto;
  border-bottom: 1px solid #ddd;
  padding-bottom: 60px;
}

.single_page_content>img {
  max-width: 100%;
  width: 320px;
  height: 213px;
  margin-bottom: 15px
}

.single_page_content ul {
  position: relative;
  padding-left: 25px
}

.single_page_content ul li {
  line-height: 25px
}

.single_page_content ul li:before {
  content: "";
  height: 5px;
  left: 5px;
  position: absolute;
  width: 9px;
  margin-top: 8px
}

.single_page_content ul li:hover {
  opacity: 0.75
}

.single_page_content h2 {
  line-height: 35px
}

.single_page_content h3 {
  line-height: 30px
}

.single_page_content h4 {
  line-height: 25px
}

.single_page_content h4 {
  line-height: 20px
}

.social_link {
  display: inline;
  float: left;
  margin-bottom: 25px;
  margin-top: 20px;
  width: 100%
}

.sociallink_nav {
  text-align: center
}

.sociallink_nav li {
  display: inline-block
}

.sociallink_nav li a {
  color: #fff;
  display: inline-block;
  font-size: 17px;
  padding: 8px 12px;
  margin: 0 3px;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.sociallink_nav li a:hover {
  -webkit-transform: rotate(50deg);
  -moz-transform: rotate(50deg);
  -ms-transform: rotate(50deg);
  -os-transform: rotate(50deg);
  transform: rotate(50deg)
}

.sociallink_nav li a:hover i {
  -webkit-transform: rotate(-50deg);
  -moz-transform: rotate(-50deg);
  -ms-transform: rotate(-50deg);
  -os-transform: rotate(-50deg);
  transform: rotate(-50deg)
}

.sociallink_nav li:nth-child(1)>a {
  background: none repeat scroll 0 0 #3b5998;
  padding: 8px 15px
}

.sociallink_nav li:nth-child(2)>a {
  background: none repeat scroll 0 0 #00acee
}

.sociallink_nav li:nth-child(3)>a {
  background: none repeat scroll 0 0 #dd4b39
}

.sociallink_nav li:nth-child(4)>a {
  background: none repeat scroll 0 0 #0e76a8
}

.sociallink_nav li:nth-child(5)>a {
  background: none repeat scroll 0 0 #c92228
}

.related_post {
  display: inline;
  float: left;
  margin-top: 0;
  width: 100%;
  margin-bottom: 20px
}

.related_post>h2 {
  border-bottom: 1px solid #e3e3e3;
  padding-bottom: 5px
}

.related_post>h2 i {
  font-size: 25px
}

.related_post .spost_nav li {
  width: 32%;
  margin-right: 10px
}

.related_post .spost_nav li:last-child {
  margin-right: 0
}

.nav-slit a {
  position: fixed;
  top: 50%;
  display: block;
  outline: none;
  text-align: left;
  z-index: 1000;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%)
}

.nav-slit a.prev {
  left: 0
}

.nav-slit a.next {
  right: 0
}

.nav-slit .icon-wrap {
  position: relative;
  display: block;
  padding: 45px 5px
}

.nav-slit .icon-wrap i {
  color: #fff;
  font-size: 40px;
  display: inline-block
}

.nav-slit div {
  position: absolute;
  top: 0;
  width: 200px;
  height: 100%;
  background-color: #939a9f;
  -webkit-transition: -webkit-transform 0.3s 0.3s;
  transition: transform 0.3s 0.3s;
  -webkit-perspective: 1000px;
  perspective: 1000px
}

.nav-slit a.prev div {
  left: 0;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%)
}

.nav-slit a.next div {
  right: 0;
  text-align: right;
  -webkit-transform: translateX(100%);
  transform: translateX(100%)
}

.nav-slit h3 {
  position: absolute;
  top: 100%;
  margin: 0;
  padding: 0 20px;
  height: 30%;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 500;
  font-size: 0.75em;
  line-height: 2.75;
  width: 200px;
  text-align: left;
  overflow: hidden;
  padding-top: 4px;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  -webkit-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webki-backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

.nav-slit img {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  width: 200px;
  height: 130px
}

.nav-slit a:hover div {
  -webkit-transform: translateX(0);
  transform: translateX(0)
}

.nav-slit a:hover h3 {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
  -webkit-transform: rotateX(0deg);
  transform: rotateX(0deg)
}

.error_page {
  float: left;
  display: inline;
  width: 100%;
  text-align: center
}

.error_page>h3 {
  text-transform: uppercase
}

.error_page>h1 {
  font-size: 110px
}

.error_page>p {
  font-size: 15px;
  margin: 0 auto;
  margin-bottom: 40px
}

.error_page>span {
  display: inline-block;
  height: 2px;
  text-align: center;
  width: 100px
}

.error_page>a {
  color: #fff;
  display: inline-block;
  padding: 5px 10px
}

.error_page>a:hover {
  opacity: 0.75
}

.contact_area {
  float: left;
  display: inline;
  width: 100%;
  margin-bottom: 30px
}

.contact_area>h2 {
  color: #fff;
  display: inline-block;
  font-size: 20px;
  padding: 7px 10px 5px;
  text-transform: uppercase;
  margin-bottom: 30px
}

.contact_area>p {
  margin-bottom: 20px
}

.contact_form input[type="text"],
.contact_form input[type="email"],
.contact_form textarea {
  border-radius: 0;
  margin-bottom: 30px
}

.contact_form input[type="submit"] {
  border: medium none;
  color: #fff;
  height: 35px;
  padding: 5px 10px;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s
}

.contact_form input[type="submit"]:hover {
  border: 1px solid #d083cf
}

@media(max-width:767px) {
  .landingArticle > a.primary-action,
  .landingVideo > .videoSection > .videoSectionRow > a.primary-action,
  .aboutVideo > .videoSection > .singleVideo > a.primary-action {
    padding: 10px 25px;
    min-width: 100%;
  } 
  .approachSection .approachCards .approachCardsRow .card {
    width: 100%;
    margin-bottom: 30px;
  }
  .approachSection .approachCards {
    padding: 20px;
  }

  #aboutUsUpper .innerSection,
  .aboutVideo .videoSection {
    display: flex;
    flex-direction: column; 
  }
  .aboutVideo .videoSection, 
  .aboutApproach, .aboutResults, 
  .aboutApproachMethods, .aboutStats, 
  .aboutValues, .aboutCommunities, 
  .aboutTeam, .aboutStory {
    padding: 0;
  }
  .aboutVideo > .videoSection > .singleVideo {
    width: 90%;
  }
  .aboutVideo > .videoSection > .singleVideo > iframe{
    width: 400px;
  }
  .blog-card {
    width: 40%;
  }
}

@media(max-width:991px) {

}
@media(max-width:480px) {
  .blog-card {
    width: 100%;
  }
}
@media(max-width:1199px) {
  .logo_area {
    width: 34%
  }

  .add_banner {
    width: 580px
  }

  .nav-tabs>li {
    width: 32.3%
  }

  .photograph_nav li {
    width: 31.5%
  }

  @media(max-width:991px) {
    .add_banner {
      display: none
    }

    .logo_area {
      width: 100%
    }

    .nav>li>a {
      padding: 8px 8px
    }

    .latest_post_container {
      height: 380px;
      overflow: hidden
    }

    #next-button {
      bottom: -2px
    }

    .single_iteam {
      height: 415px
    }

    .photograph_nav li {
      width: 47.7%
    }

    .related_post .spost_nav li {
      width: 100%
    }

    .nav-tabs>li {
      width: 31.9%
    }

    .nav-tabs>li>a {
      font-size: 13px;
      padding-left: 0 !important;
      padding-right: 0 !important;
      text-align: center
    }
  }

  @media(max-width:767px) {

    .navbar-collapse {
      padding-left: 15px;
      width: 100%;
    }

    .navbar {
      border: medium none;
      border-radius: 0;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      justify-content: center;
      margin-bottom: 0 !important;
      width: 50%;
    }

    .mobile-show {
      display: block
    }

    .desktop-home {
      display: none
    }

    .navbar-inverse .navbar-nav>li>a {
      display: block
    }

    .header_top_left {
      width: 100%
    }

    .header_top_right {
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .social_area {
      display: none
    }

    .single_iteam a {
      height: 100%
    }

    .single_iteam a>img {
      height: 100%
    }

    .error_page>a {
      margin-bottom: 25px
    }

    .nav-tabs>li {
      width: 32.6%
    }
  }

  @media(max-width:480px) {
    .top_nav {
      text-align: center
    }

    .single_post_content_left {
      width: 100%
    }

    .single_post_content_right {
      width: 100%
    }

    .fashion {
      width: 100%
    }

    .technology {
      width: 100%
    }

    .copyright {
      text-align: center;
      width: 100%
    }

    .developer {
      text-align: center;
      width: 100%
    }

    .single_iteam {
      height: 300px
    }

    .photo_grid figure {
      height: 200px
    }

    .photograph_nav li {
      width: 100%;
      margin-left: 0
    }

    .nav>li>a {
      padding: 8px 12px
    }

    .nav-tabs>li {
      width: 32.6%
    }
  }

  @media(max-width:360px) {
    .latest_newsarea span {
      font-size: 12px;
      line-height: 2.2em;
      padding: 2px 10px 1px 10px
    }

    .single_iteam {
      height: 210px
    }

    .slider_article>p {
      display: none
    }

    .error_page>span {
      width: 80px
    }

    .nav-tabs>li {
      width: 32.3%
    }

    .pagination>li>a,
    .pagination>li>span {
      padding: 4px 8px
    }
  }

  @media(max-width:320px) {
    .sociallink_nav li a {
      padding: 5px 10px
    }

    .sociallink_nav li:nth-child(1)>a {
      padding: 5px 13px
    }

    .nav-tabs>li {
      width: 32.1%
    }
  }
}