@charset "utf-8";
/* CSS Document */

.introWrapper {
  background-image: url("/cisiweb2/image/education/schoolscollegesheader3.jpg");
  background-position: left 70%;
}

.blocks .container-fluid {
  padding: 0px;
}

.blocks .sfContentBlock {
  margin-bottom: 0px !important;
}
h1.subTitle {
  display: flex;
}
.subTitle span {
  padding-right: 50px;
}
.schoolsBlock,
.universitiesBlock,
.getintofinanceBlock,
.workexperienceBlock,
.apprenticeshipsBlock,
.educationaltrustBlock {
  height: 356px;
  box-sizing: border-box;
  padding: 0px;
  background-size: cover;
  background-position: center center;
  text-align: center;
  overflow: hidden;
}

.schoolsBlock h2,
.universitiesBlock h2,
.workexperienceBlock h2,
.apprenticeshipsBlock h2,
.educationaltrust h2 {
  font-size: 40px !important;
  font-weight: 200 !important;
  color: #ffffff !important;
  transform: translate3d(0, 200%, 0);
  transition: transform 0.35s;
}

.getintofinanceBlock h2 {
  transform: translate3d(0, 35%, 0);
  transition: transform 0.35s;
}

.getintofinance h2 img {
  width: 300px;
  transition: width 0.35s;
}

.schoolsBlock p,
.universitiesBlock p,
.getintofinanceBlock p,
.workexperienceBlock p,
.apprenticeshipsBlock p,
.educationaltrust p {
  color: #ffffff;
  opacity: 0;
  padding: 0 10%;
  font-size: 14px;
  margin-top: 40px;
  transform: translate3d(0, -10%, 0);
  transition: transform 0.35s;
  transition: opacity 0.35s;
}

.schoolsBlock {
  background-image: url("/cisiweb2/image/education/schoolscollegesblock.jpg");
}

.universitiesBlock {
  background-image: url("/cisiweb2/image/education/universitiesblock.jpg");
}

.workexperienceBlock {
  background-image: url("/cisiweb2/image/education/workexperienceblock.jpg");
}

.apprenticeshipsBlock {
  background-image: url("/cisiweb2/image/education/apprenticeshipsblock.jpg");
}

.educationaltrustBlock {
  background-image: url("/cisiweb2/image/education/educationaltrustblock.jpg");
}

.schools,
.universities,
.getintofinance,
.workexperience,
.apprenticeships,
.educationaltrust {
  height: 356px;
}

.schoolsBlock:hover h2,
.universitiesBlock:hover h2,
.workexperienceBlock:hover h2,
.apprenticeshipsBlock:hover h2,
.educationaltrustBlock:hover h2 {
  transform: translate3d(0, 50%, 0);
}
.getintofinanceBlock:hover h2 {
  transform: translate3d(0, 0%, 0);
}
.getintofinance:hover h2 img {
  width: 100px;
}

.schoolsBlock:hover p,
.universitiesBlock:hover p,
.getintofinanceBlock:hover p,
.workexperienceBlock:hover p,
.apprenticeshipsBlock:hover p,
.educationaltrustBlock:hover p {
  transform: translate3d(0, 0%, 0);
  opacity: 1;
}

.schoolsBlock:hover,
.universitiesBlock:hover,
.getintofinanceBlock:hover,
.workexperienceBlock:hover,
.apprenticeshipsBlock:hover,
.educationaltrustBlock:hover {
  transition: all 0.35s ease-in-out;
}

.blocks .row {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

@media (max-width: 1599px) {
  .schoolsBlock h2,
  .universitiesBlock h2,
  .getintofinanceBlock h2,
  .workexperienceBlock h2,
  .apprenticeshipsBlock h2,
  .educationaltrustBlock h2 {
    font-size: 36px !important;
  }
}

@media (max-width: 1199px) {
  h1.subTitle {
    font-size: 30px !important;
  }
  .schoolsBlock,
  .universitiesBlock,
  .getintofinanceBlock,
  .workexperienceBlock,
  .apprenticeshipsBlock,
  .educationaltrustBlock {
    min-height: 300px;
  }

  .schoolsBlock h2,
  .universitiesBlock h2,
  .getintofinanceBlock h2,
  .workexperienceBlock h2,
  .apprenticeshipsBlock h2,
  .educationaltrustBlock h2 {
    font-size: 30px !important;
    transform: none;
  }

  .schoolsBlock p,
  .universitiesBlock p,
  .getintofinanceBlock p,
  .workexperienceBlock p,
  .apprenticeshipsBlock p,
  .educationaltrustBlock p {
    opacity: 1;
    padding: 0 5%;
    font-size: 14px;
    line-height: normal;
    margin-top: 20px;
    transform: none;
  }

  .schools,
  .universities,
  .getintofinance,
  .workexperience,
  .apprenticeships,
  .educationaltrust {
    min-height: 300px;
  }

  .schoolsBlock:hover h2,
  .universitiesBlock:hover h2,
  .getintofinanceBlock:hover h2,
  .workexperienceBlock:hover h2,
  .apprenticeshipsBlock:hover h2 {
    transform: none;
  }
  .educationaltrustBlock:hover h2 {
    transform: none;
  }

  .schoolsBlock:hover p,
  .universitiesBlock:hover p,
  .getintofinanceBlock:hover p,
  .workexperienceBlock:hover p,
  .apprenticeshipsBlock:hover p {
    transform: none;
    opacity: 1;
  }
  .educationaltrustBlock:hover p {
    transform: none;
    opacity: 1;
  }

  .schoolsBlock::after,
  .universitiesBlock::after,
  .getintofinanceBlock::after,
  .workexperienceBlock::after,
  .apprenticeshipsBlock::after,
  .educationaltrustBlock::after {
    border-top: 0px solid #fff;
    border-bottom: 0px solid #fff;
    transform: none;
  }
  .schoolsBlock:hover::after,
  .universitiesBlock:hover::after,
  .getintofinanceBlock:hover::after,
  .workexperienceBlock:hover::after,
  .apprenticeshipsBlock:hover::after,
  .educationaltrustBlock:hover::after {
    transform: none;
  }
  .schoolsBlock,
  .universitiesBlock,
  .getintofinanceBlock,
  .workexperienceBlock,
  .apprenticeshipsBlock,
  .educationaltrustBlock {
    height: 256px;
    box-sizing: border-box;
    padding: 0px;
    background-size: cover;
    background-position: center center;
    text-align: center;
    overflow: hidden;
  }
  .schools,
  .universities,
  .getintofinance,
  .workexperience,
  .apprenticeships,
  .educationaltrust {
    height: 256px;
  }
}

@media (max-width: 991px) {
  .schoolsBlock,
  .universitiesBlock,
  .getintofinanceBlock,
  .workexperienceBlock,
  .apprenticeshipsBlock,
  .educationaltrustBlock {
    min-height: 0px;
  }

  .schools,
  .universities,
  .getintofinance,
  .workexperience,
  .apprenticeships,
  .educationaltrust {
    min-height: 0px;
  }
  .subTitle span {
    padding-right: 35px;
    font-size: 25px;
  }
  .introWrapper h2 {
    font-size: 39px !important;
    margin-top: 80px;
  }
}
@media (max-width: 600px) {
  h1.subTitle {
    flex-wrap: wrap;
  }
  .subTitle span {
    padding-right: 20px;
    font-size: 25px;
  }
  .introWrapper h2 {
    font-size: 30px !important;
  }
}