.splitscreen {
  width: 100%;
  height: 100vh;
  position: relative;
}

.mainlogo {
  width: 300px;
  height: 67px;
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  z-index: 100;
}

.B2info {
  text-align: center;
  width: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


.B2B {
  width: 50%;
  height: 100vh;
  position: absolute;
  left: 0;
  background-image: url('../images/B2B.jpg');
  background-size: cover;
}

.B2C {
  width: 50%;
  height: 100vh;
  position: absolute;
  right: 0;
  background-image: url('../images/B2C.jpg');
  background-size: cover;
}


@media screen and (max-width: 960px){



  .mainlogo {
    width: 300px;
    height: 67px;
    position: absolute;
    top: 48%!important;
    left: 50%;
    transform: translate(-50%, -50%);
    background-repeat: no-repeat;
  }


  .B2B {
    width: 100%;
    height: 50%;
    position: absolute;
    top: 0;
  }

  .B2C {
    width: 100%;
    height: 50%;
    position: absolute;
    bottom: 0;
  }
}


@media screen and (max-width: 768px){

  .mainlogo {
    width: 300px;
    height: 67px;
    position: absolute;
    top: 50.5%!important;
    left: 50%;
    transform: translate(-50%, -50%);
    background-repeat: no-repeat;
  }


  .B2info {
    width: 90%;
  }

  .splitscreen {
    width: 100%;
    height: 90vh!important;
  }
}