*, *:before, *:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  transition: all 1s ease; }

#toggle {
  position: fixed; }

#mainParent {
  position: relative;
  background: url("backg.jpg") no-repeat center;
  background-size: cover;
  width: 100%;
  height: 200vh; }
  #mainParent #animation {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto; }
    #mainParent #animation .line {
      top: 50vh;
      left: 0;
      right: 0;
      margin: 0 auto;
      position: absolute;
      text-align: center; }
      #mainParent #animation .line .window {
        display: inline-block;
        position: relative;
        margin: 0 49px;
        border: solid 10px white;
        width: 150px;
        height: 150px;
        transform: rotateZ(45deg); }
      #mainParent #animation .line:not(:first-of-type) .window:after {
        opacity: 0;
        position: relative;
        display: block;
        content: "";
        width: 130px;
        height: 130px;
        background: url("avatar.jpg") no-repeat center;
        background-size: cover; }
  #mainParent.logo #animation {
    top: 0; }
    #mainParent.logo #animation .line:nth-of-type(1) {
      margin-top: -250px; }
    #mainParent.logo #animation .line:nth-of-type(2) {
      margin-top: -125px; }
  #mainParent.people #animation {
    top: 100vh; }
    #mainParent.people #animation .line {
      color: white; }
      #mainParent.people #animation .line:nth-of-type(1) {
        margin-top: -400px; }
      #mainParent.people #animation .line .window {
        margin: 0 220px; }
      #mainParent.people #animation .line:not(:first-of-type) .window:after {
        opacity: 1; }

/*# sourceMappingURL=style.css.map */
