/***
This file contains Our Program page Styles 
***/

.our-program .section-banner-custom {
  height: 364px;
}

.our-program .section-banner-custom .banner-content-wrapper-custom {
  padding: 126px 44px 79px;
}

.section-program {
  min-height: 2407px;
  padding-top: 82px;

  background-image: url(http://dev-becec.pantheonsite.io/wp-content/uploads/2018/09/belief-img.png);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: contain;
  background-color: #ceedfb;

  transition: .3s;
}

.section-program .program-wrapper {
  position: relative;
}

.section-program .program-wrapper:nth-of-type(1) {
  height: 484px;
}

.section-program .program-wrapper:nth-of-type(2) {
  height: 496px;
}

.section-program .program-wrapper:nth-of-type(3) {
  height: 567px;
}

.section-program .program-bg-img {
  height: 400px;

  background-repeat: no-repeat;
}

.section-program .program-content {  
  position: absolute;
  bottom: 31px;
  left: 293px;

  width: 610px;
  padding: 30px 37px;
  
  font-family: 'Poppins SemiBold';
  font-size: 20px;
  line-height: 25px;
  color: #fff;

  transition: .3s;
}

.section-program .first-program-content {
  background-color: #f5b16d;
}

.section-program .second-program-content {
  bottom: 27px;
  left: 53px;

  width: 727px;

  background-color: #b7c575;
}

.section-program .third-program-content {
  right: 82px;
  bottom: 24px;
  left: unset;

  width: 746px;

  background-color: #9680b1;
}

.section-program .fourth-program-content {
  bottom: -58px;
  left: 52px;

  width: 727px;

  background-color: #59a5c6;
}

.section-program .program-img-wrapper {
  position: absolute;
  z-index: 1;

  transition: .3s;
}

.section-program .first-img-wrapper {
  bottom: 30px;
  left: 135px;
}

.section-program .second-img-wrapper {
  right: 117px;
  bottom: 27px;
  left: unset;
}

.section-program .third-img-wrapper {
  bottom: 28px;
  left: 176px;
}

.section-program .fourth-img-wrapper {
  right: 189px;
  bottom: -55px;
  left: unset;
}

.section-program .program-illustration {
  max-width: 85%;
}

.section-program .second-illustration {
  max-width: 74%;
}

.section-program .third-illustration {
  max-width: 68%;
}

.section-program .fourth-illustration {
  max-width: 96%;
}

.section-program .program-bg-even {
  background-position: right;
}

@media (min-width: 992px) and (max-width: 1199px) {
  .section-program {
    min-height: 2255px;
  }
  
  .section-program .second-img-wrapper {
    right: -27px;
    bottom: 35px;

    width: 215px;
  }

  .section-program .third-img-wrapper {
    left: -6px;
  }

  .section-program .fourth-img-wrapper {
    right: 7px;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .section-program {
    min-height: 2220px;
  }

  .section-program .first-img-wrapper {
    left: -22px;
  }

  .section-program .first-program-content {
    left: 132px;

    width: 580px;
  }

  .section-program .second-img-wrapper {
    right: -30px;
    bottom: 44px;

    width: 185px;
  }

  .section-program .second-program-content {
    left: -24px;

    width: 600px;
  }

  .section-program .third-img-wrapper {
    bottom: 50px;
    left: -22px;
  }

  .section-program .third-program-content {
    right: 0;
    left: 86px;

    width: 625px; 
  }

  .section-program .fourth-img-wrapper {
    right: -31px;
  }

  .section-program .fourth-program-content {
    left: -25px;

    width: 600px;
  }
}

@media screen and (max-width: 991px) {
  .section-program .second-illustration {
    max-width: 100%;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  .our-program .section-banner-custom {
	height: 323px;
  }
	
  .section-program {
    min-height: 2185px;
  }

  .section-program .program-content {
    font-size: 18px;
  }

  .section-program .first-img-wrapper {
    bottom: 53px;
    left: -20px;
    width: 240px;
  }

  .section-program .first-program-content {
    left: 153px;

    width: 375px;
  }

  .section-program .second-img-wrapper {
    right: -18px;

    width: 151px;
  }

  .section-program .second-program-content {
    left: -18px;
    width: 432px;
  }

  .section-program .third-img-wrapper {
    left: -24px;
  }

  .section-program .third-program-content {
    right: -18px;

    width: 445px;
  }

  .section-program .fourth-img-wrapper {
    right: -28px;
    bottom: -44px;

    width: 147px;
  }

  .section-program .fourth-program-content {
    left: -18px;

    width: 440px;
  }
}

@media (min-width: 320px) and (max-width: 575px) {
  .our-program .section-banner-custom {
	height: auto;
    padding-top: 3px;
  }
	
  .our-program .section-banner-custom .banner-content-wrapper-custom {
	padding: 47px 16px 32px;	
  }
	
  .section-program {
    min-height: auto;
	padding-top: 35px;
  }
  
  .section-program .program-wrapper {
    padding-bottom: 30px;
  }

  .section-program .program-bg-img {
    background-size: cover;

    height: 145px;
  }

  .section-program .program-wrapper:nth-of-type(1) {
    height: auto;
  }
  
  .section-program .program-wrapper:nth-of-type(2) {
    height: auto;
  }
  
  .section-program .program-wrapper:nth-of-type(3) {
    height: auto;
  }

  .section-program .program-img-wrapper {
    top: 10px;
    left: 7px;
  }

  .section-program .first-img-wrapper {
    width: 165px;
  }

  .section-program .second-img-wrapper {
    width: 120px;
  }

  .section-program .third-img-wrapper {
    width: 130px;
  }

  .section-program .fourth-img-wrapper {
    width: 135px;
  }

  .section-program .program-content {
    position: initial;

    width: 100%;
    padding: 20px;

    font-size: 14px;
	line-height: 22px;
  }
}