Difference between revisions of "Template:NCKU Tainan/team css"

 
(13 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
  <style>
+
<style>
 +
 
 
.vertical-container {
 
.vertical-container {
   background-image: url('https://static.igem.org/mediawiki/2017/2/21/NCKU-team-background.jpeg');
+
   background-image: url('https://static.igem.org/mediawiki/2017/0/09/T--NCKU_Tainan--team-background.png');
 
   background-attachment: fixed;
 
   background-attachment: fixed;
 
}
 
}
Line 19: Line 20:
 
     margin-bottom: 80px;
 
     margin-bottom: 80px;
 
   }
 
   }
   #paragraph.part h1 {
+
   #font h1 {  
     font-family: 'Montserrat', sans-serif;
+
     font-family: 'Montserrat', sans-serif !important;
     font-size: 40px !important;
+
     font-size: 60px !important;
     color: #333;
+
    font-weight: lighter !important;
 +
     color: #333 ;
 
   }
 
   }
 
   .flip {
 
   .flip {
Line 41: Line 43:
 
       -webkit-transition: 0.5s;
 
       -webkit-transition: 0.5s;
 
   }
 
   }
   #paragraph.flip .card .namecard {
+
   .flip .card .namecard {
 
       width: 100%;
 
       width: 100%;
 
       height: 100%;
 
       height: 100%;
Line 47: Line 49:
 
       -webkit-backface-visibility: hidden;
 
       -webkit-backface-visibility: hidden;
 
       z-index: 2;
 
       z-index: 2;
       font-size: 3em !important;
+
       font-size: 3em;
 
       text-align: center;
 
       text-align: center;
 
       line-height: 200px;
 
       line-height: 200px;
Line 111: Line 113:
 
     vertical-align: bottom;
 
     vertical-align: bottom;
 
   }
 
   }
   #paragraph.txt h2 {
+
   .txt h2 {
 
     font-family: 'Raleway', sans-serif;
 
     font-family: 'Raleway', sans-serif;
     font-size: 30px !important;
+
     font-size: 23px;
 
     font-style: italic;
 
     font-style: italic;
 
     font-weight: 700;
 
     font-weight: 700;
 
     color: #333;
 
     color: #333;
 +
    height:45px;
 
     letter-spacing: 2px;
 
     letter-spacing: 2px;
 
     margin-top: 45px;
 
     margin-top: 45px;
 
   }
 
   }
+
   /*.txt h5 {
   #paragraph.card .back h2 {
+
 
     font-family: 'Montserrat', sans-serif;
 
     font-family: 'Montserrat', sans-serif;
     font-size: 24px !important;
+
    color: #0094ad;
 +
    font-size: 24px;
 +
    letter-spacing: 4px;
 +
  }
 +
  .txt HR {
 +
    position:absolute;
 +
    top:250px;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
  }
 +
  .txt span {
 +
    color: rgb(129, 104, 182);
 +
    font-size: 11px;
 +
  }*/
 +
  .card .back h2 {
 +
    font-family: 'Montserrat', sans-serif;
 +
     font-size: 24px;
 
     font-weight: normal;
 
     font-weight: normal;
 
     color: #f9cb8f;
 
     color: #f9cb8f;
Line 139: Line 157:
 
     color: #f19181;
 
     color: #f19181;
 
   }
 
   }
    
+
   /*.card .back span {
  #paragraph.card .back h5 {
+
    font-family: 'Montserrat', sans-serif;
 +
    padding: 0px;
 +
    font-size: 18px;
 +
    color: #0094ad;
 +
    letter-spacing: 2px;
 +
  }*/
 +
  .card .back h5 {
 
     font-family: 'Raleway', sans-serif;
 
     font-family: 'Raleway', sans-serif;
 
     color: #555;
 
     color: #555;
     font-size: 18px !important;
+
     font-size: 18px;
 
     font-weight: normal;
 
     font-weight: normal;
 
     /* letter-spacing: 2px; */
 
     /* letter-spacing: 2px; */
Line 150: Line 174:
 
     line-height: normal;
 
     line-height: normal;
 
   }
 
   }
    
+
   /*.card .back HR {
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
  }
 +
  .card .back p {
 +
    font-family: 'Montserrat', sans-serif;
 +
    width: 22 em;
 +
    word-wrap: break-word;
 +
    font-size: 24px;
 +
    font-weight: 900;
 +
    word-wrap: break-word;
 +
    color: rgba(13, 1, 6, 0.96);
 +
    line-height: 24px;
 +
    display: block;
 +
  }*/
 
   .flip .card .namecard .logo {
 
   .flip .card .namecard .logo {
 
     width: 120px;
 
     width: 120px;
Line 159: Line 197:
 
     right: 0px;
 
     right: 0px;
 
     bottom: -35px;
 
     bottom: -35px;
     background-image: url(/assets/img/fish.png);
+
     background-image: url('https://static.igem.org/mediawiki/2017/f/fb/Fish.png');
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 
     background-size: cover;
 
     background-size: cover;
Line 167: Line 205:
 
   }
 
   }
 
   /* 動畫 */
 
   /* 動畫 */
   #paragraph.tit h1 {
+
   #font.tit h1 {
 
     text-align: center;
 
     text-align: center;
     font-size: 80px !important;
+
     font-size: 80px;
 
     font-family: 'Montserrat', sans-serif;
 
     font-family: 'Montserrat', sans-serif;
 
     color: #333;
 
     color: #333;
Line 176: Line 214:
 
   }
 
   }
 
   .tit {
 
   .tit {
     height: 200px;  
+
     height: 200px;
 +
    /*border: 2px solid rgb(173, 83, 213);*/
 
   }
 
   }
 
   hr {
 
   hr {
Line 191: Line 230:
 
     text-align: center;
 
     text-align: center;
 
   }
 
   }
   #paragraph.part h1 {
+
   #font h1 {
 
     font-family: 'Montserrat', sans-serif;
 
     font-family: 'Montserrat', sans-serif;
     font-size: 60px !important;
+
     font-size: 60px;
 
     font-weight: lighter;
 
     font-weight: lighter;
 
     color: #333;
 
     color: #333;
Line 214: Line 253:
 
       -webkit-transition: 0.5s;
 
       -webkit-transition: 0.5s;
 
   }
 
   }
   #paragraph.flip .card .namecard {
+
   .flip .card .namecard {
 
       width: 100%;
 
       width: 100%;
 
       height: 100%;
 
       height: 100%;
Line 221: Line 260:
 
       z-index: 2;
 
       z-index: 2;
 
       font-family: Georgia;
 
       font-family: Georgia;
       font-size: 3em !important;
+
       font-size: 3em;
 
       text-align: center;
 
       text-align: center;
 
       line-height: 200px;
 
       line-height: 200px;
Line 238: Line 277:
 
       border-radius: 15px;
 
       border-radius: 15px;
 
       overflow: hidden;
 
       overflow: hidden;
       cursor: pointer;    
+
       cursor: pointer;
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);    
+
      /*border: 10px solid transparent;*/
 +
      /*padding: 15px;*/
 +
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 +
      /*-webkit-border-image: url(/assets/img/border.png) 20% stretch;
 +
      -moz-border-image: url(/assets/img/border.png) 20% stretch;*/
 +
      /* Safari 3.1-5 */
 +
      /*-o-border-image: url(/assets/img/border.png) 20% stretch;*/
 +
      /* Opera 11-12.1 */
 +
      /*border-image: url(/assets/img/border.png) 20% stretch;*/
 
   }
 
   }
 
   .flip .card .back {
 
   .flip .card .back {
Line 248: Line 295:
 
       border-radius: 15px;
 
       border-radius: 15px;
 
       overflow: hidden;
 
       overflow: hidden;
 +
      /*border: 10px solid transparent;*/
 
       padding-left: 15px;
 
       padding-left: 15px;
 
       padding-right: 15px;
 
       padding-right: 15px;
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);  
+
       box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
 +
      /*-webkit-border-image: url(/assets/img/border.png) 20% stretch;
 +
      -moz-border-image: url(/assets/img/border.png) 20% stretch;*/
 +
      /* Safari 3.1-5 */
 +
      /*-o-border-image: url(/assets/img/border.png) 20% stretch;*/
 +
      /* Opera 11-12.1 */
 +
      /*border-image: url(/assets/img/border.png) 20% stretch;*/
 
       text-align: left;
 
       text-align: left;
  
Line 256: Line 310:
 
   .namecard img {
 
   .namecard img {
 
     width: 300px;
 
     width: 300px;
     height: 300px;  
+
     height: 300px;
     border-radius: 8px 8px 0 0;  
+
    /*margin: auto;*/
 +
     border-radius: 8px 8px 0 0;
 +
    /*box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);*/
 
     transition-duration: 0.4s;
 
     transition-duration: 0.4s;
 
   }
 
   }
Line 269: Line 325:
 
     vertical-align: bottom;
 
     vertical-align: bottom;
 
   }
 
   }
   #paragraph.txt h2 {
+
   .txt h2 {
 
     font-family: 'Raleway', sans-serif;
 
     font-family: 'Raleway', sans-serif;
     font-size: 30px !important;
+
     font-size: 23px;
 
     font-style: italic;
 
     font-style: italic;
 
     font-weight: 700;
 
     font-weight: 700;
 +
    height:45px;
 
     color: #333;
 
     color: #333;
 
     letter-spacing: 2px;
 
     letter-spacing: 2px;
     margin-top: 45px;
+
     margin-top: 45px ;
 
   }
 
   }
   #paragraph.card .back h2 {
+
   .card .back h2 {
 
     font-family: 'Montserrat', sans-serif;
 
     font-family: 'Montserrat', sans-serif;
     font-size: 24px important;
+
     font-size: 24px;
 
     font-weight: normal;
 
     font-weight: normal;
 
     color: #f9cb8f;
 
     color: #f9cb8f;
Line 296: Line 353:
 
     color: #f19181;
 
     color: #f19181;
 
   }
 
   }
   #paragraph.card .back h5 {
+
   .card .back h5 {
 
     font-family: 'Raleway', sans-serif;
 
     font-family: 'Raleway', sans-serif;
 
     color: #555;
 
     color: #555;
     font-size: 18px !impotant;
+
     font-size: 18px;
 
     font-weight: normal;
 
     font-weight: normal;
 
     /* letter-spacing: 2px; */
 
     /* letter-spacing: 2px; */
Line 314: Line 371:
 
     right: 0px;
 
     right: 0px;
 
     bottom: -35px;
 
     bottom: -35px;
     background-image: url(/assets/img/fish.png);
+
     background-image: url('https://static.igem.org/mediawiki/2017/f/fb/Fish.png');
 
     background-repeat: no-repeat;
 
     background-repeat: no-repeat;
 
     background-size: cover;
 
     background-size: cover;
Line 322: Line 379:
 
   }
 
   }
 
   /* 動畫 */
 
   /* 動畫 */
   #paragraph.tit h1 {
+
   #font.tit h1 {
 
     text-align: center;
 
     text-align: center;
     font-size: 120px !important;
+
     font-size: 120px;
 
     font-family: 'Montserrat', sans-serif;
 
     font-family: 'Montserrat', sans-serif;
 
     color: #333;
 
     color: #333;
Line 358: Line 415:
 
}
 
}
 
.teacher .txt h2 {
 
.teacher .txt h2 {
    
+
   /*font-size: 48px;*/
 
}
 
}
#paragraph.teacher p {
+
.teacher p {
 
   font-family: 'Raleway', sans-serif;
 
   font-family: 'Raleway', sans-serif;
 
   width: 330px;
 
   width: 330px;
 
   word-wrap: break-word;
 
   word-wrap: break-word;
   font-size: 17px !important;
+
   font-size: 17px;
 
   font-weight: normal;
 
   font-weight: normal;
 
   word-wrap: break-word;
 
   word-wrap: break-word;
Line 389: Line 446:
 
   background-color: #f19181;
 
   background-color: #f19181;
 
}
 
}
 +
 
}
 
}
 +
 +
 +
 +
 +
  
 
</style>
 
</style>

Latest revision as of 13:48, 31 October 2017