body {
  font-family: "Microsoft JhengHei";
}

.center {
  text-align: center;
}

.EulerLogo {
  margin: auto;
  position: relative;
  left: -800px;
  text-align: center;
}

.centerin {
  margin: auto;
}

.indexbigTitle {
  font-size: 40px;
}

.IndexApprol {
  height: 100px;
  background-image: url("../img/Indexapprol.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}
.backcircle {
  width: 170px;
  height: 170px;
  background-color: rgb(27, 88, 161);
  border-radius: 999em;
  position: relative;
  margin: auto;
}

.apptext {
  text-align: left;
  text-justify: initial;
}

.photo0 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/陳卓然.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 1px;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo1 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/photo.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-color: gray;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo2 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/陳佩吟.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 1px;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo3 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/李虹錤.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo4 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/李奇錄.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 1px;
  background-color: gray;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo5 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/邢耕華.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 1px;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.photo6 {
  background-color: gray;
  border-radius: 999em;
  height: 150px;
  width: 150px;
  background-image: url("../img/photowj.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  border: solid 10px #fff;
  position: relative;
  top: 10px;
}

.IndexExample {
  height: 100px;
  background-image: url("../img/IndexExample.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
}

.Indexexample1 {
  height: 70vh;
  background-image: url("../img/e1.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

.Indexexample2 {
  height: 70vh;
  background-image: url("../img/e2.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

.Indexexample3 {
  height: 70vh;
  background-image: url("../img/e3.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

.Indexexample4 {
  height: 70vh;
  background-image: url("../img/e4.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

.IndexRegis {
  height: 200px;
  background-image: url("../img/Signupnow.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}
.IndexRegis:hover {
  height: 200px;
  background-image: url("../img/Signupnowhover.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top center;
}

@media (min-width: 0px) {
  .indexTopOuter {
    width: 100vw;
    height: 80vh;
    background-image: url("../img/mobile2020.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
  }

  .indexAwards {
    height: 100vh;
    background-image: url("../img/IndexawardsMobpic.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
  }
  .displaynone {
    display: none;
  }
  .displayblock {
    display: block;
  }

  /*portal*/
  .portaltop {
    height: 25vh;
    background-image: url("../img/protalTop.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
  }
  .portalleft {
    height: 50vh;
    background-image: url("../img/leftportal0.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  .portalleft:hover {
    height: 50vh;
    background-image: url("../img/leftportal0hover.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  .portalright {
    height: 50vh;
    background-image: url("../img/rightportal.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  /*portal*/
}

@media (min-width: 1000px) {
  .indexTopOuter {
    width: 100vw;
    height: 95vh;
    background-image: url("../img/虎門尤拉盃CAE創意大賽_工作區域 1.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    margin: auto;
  }

  .indexAwards {
    height: 500px;
    background-image: url("../img/虎門尤拉盃CAE創意大賽-02.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: top center;
  }
  .displaynone {
    display: block;
  }
  .displayblock {
    display: none;
  }

  /*portal*/
  .portaltop {
    height: 25vh;
    background-image: url("../img/protalTop.png");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center center;
  }
  .portalleft {
    height: 75vh;
    background-image: url("../img/leftportal0.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  .portalleft:hover {
    height: 75vh;
    background-image: url("../img/leftportal0hover.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  .portalright {
    height: 75vh;
    background-image: url("../img/rightportal.png");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
  }
  /*portal*/
}

.card {
  background-color: #c9c9c9;
  padding: 20px;
  text-align: center;
}

.allwork {
  width: 80vw;
  background-color: #efefef;
  margin: auto;
  text-align: left;
  text-decoration: none;
}
.alltable {
}

.tr1 {
  width: 3%;
}
.tr2 {
  width: 17%;
}
.tr3 {
  width: 55%;
}
.tr4 {
  width: 20%;
}
.tr5 {
  width: 5%;
}