@charset "UTF-8";

@font-face {
  font-family: myFirstFont;
  src: url(ITCAvantGardeStd-XLt.otf);
}

.padnone{
  padding-top:0%!important;
  padding-bottom:0%!important; 
}

.padbtnone{
  padding-bottom:0%!important; 
}
.padw1{
  padding-top:.5%!important;
  padding-bottom:.5%!important; 
}

.padw1 p{
  font-size: 15px!important;
}
.flowhid{
  overflow:hidden;
}

.wrapper,.head,.container,.footer,.menu,.tophead{
  width: 100%;
  float: left;
}

.mobile{
  display: block;
}

.web{
  display:none;
}

.fltrigh{
  float: right!important;
}

/*head
---------------------------------------------------------*/
.tophead{
  position: fixed;
  background:#fff;
  z-index: 10;
  border-bottom:1px solid #ccc;
}

/*head*/
.head{
  padding: 0% 0;
  border-top:10px solid #3cc5fc; 
  z-index: 2;
}

.menu{
  /*background: #f00;*/
  padding: 0 0;
  border-top: 0px solid #ddd;
}

.menu .active a{
  color:#3cc5fc;

}

/*container
----------------------------------------------------------*/
.container{
  padding:110px 0 0 0;
  background: url(../images/paper.jpg) center center fixed no-repeat;
  -moz-background-size: cover;
  background-size: cover;

}
/*內容顯示部分*/
.board{
  width: 90%;
  margin: 0px auto;
  background: #ff0;
}

/*我要投稿*/
.publish{
  width: 100%;
  margin: 5% auto;
  /*background: #ff0;*/
}

/*作品集*/
.portfolio{
  width: 90%;
  margin: 5% auto;
  background: #ff0;
}

/*投票*/
.vote{
  width: 90%;
  margin: 5% auto;
  background: #ff0;
}

.po-1x,.po-2x,.po-3x,.po-4x,.po-5x,.po-6x{
  width: 100%;
  float: left;
  margin: 0% 0;
  /*background: #999*/
}

.co-1x,.co-2x,.co-3x,.co-4x{
  width: 100%;
  float: left;
  margin: 0% 0;
  /*background: #999*/
}

/*footer最外層
----------------------------------------------------------*/
.footer{
  padding: 50px 0 30px 0;
  /*background-color: #ff0;*/
}

.footer .copyright{
  text-align: center;
  margin: 5% 0 0 0;
  font-size: 12px;
  color:#999;
}

@media only screen and (min-width: 480px) {
  
}

@media only screen and (min-width: 640px) {
  
  .co-1x,.co-2x,.co-3x{
    width: 50%;
  }
  /*head*/
  .head{ 
    position: relative;
  }
}

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

  .container{
    padding:155px 0 0 0;
  }  
}

@media only screen and (min-width:769px) {

  .home{
    background: url(../images/homebg.png) center center no-repeat;
    padding: 22px 0!important;
    text-align: center;
  }

  .home a,.home a:hover{
    color: #fff!important;
  }

  .menu{
    padding: .5% 0;
  }
 

  .board{
    width: 94%;
  }

  /*作品集*/
  .portfolio{
    width: 75%;
  }
  /*我要投稿*/
  .publish{
    width: 45%;
  }
  /*投票*/
  .vote{
    width: 92%;
  }

  .po-1x{
    width: 16.5%
  }
  .po-2x{
    width: 33.5%;
  }
  .po-3x{
    width: 50%
  }
  .po-4x{
    width: 66.5%;
  }
  .po-5x{
    width: 83.5%;
  }
  .po-6x{
    width: 100%;
  }

  .co-1x{
    width: 25%
  }
  .co-2x{
    width: 50%;
  }
  .co-3x{
    width: 75%
  }
  .co-4x{
    width: 100%;
  }
  .container{
    padding:95px 0 0 0;
  }

}

@media only screen and (min-width: 900px) {
   /*作品集
  .portfolio{
    width: 75%;
  }*/
  .mobile{
    display: none;
  }
  .web{
    display: block;
  }
}

/*# sourceMappingURL=style.css.map */
@media only screen and (min-width: 1280px) {
   /*作品集*/
  .portfolio{
    width: 60%;
  }
}

/*# sourceMappingURL=style.css.map */
@media only screen and (min-width: 1366px) {

  .container{
    /*padding:106px 0 0 0;*/
  }
  .board{
    width: 81.6%;
  }
  /*投票*/
  .vote{
    width: 80%;
  }
  /*作品集*/
  .portfolio{
    width: 55%;
  }
}

@media only screen and (min-width: 1440px) {
   
}

@media only screen and (min-width: 1600px) {
  
  .container{
    padding:104px 0 0 0;
  }
  .board{
    width: 63.6%;
  }
  /*投票*/
  .vote{
    width: 69%;
  }
  /*作品集*/
  .portfolio{
    width: 50%;
  }
}