Ssccb12040 (Talk | contribs) |
|||
(13 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
− | + | <style> | |
+ | |||
.vertical-container { | .vertical-container { | ||
− | background-image: url('https://static.igem.org/mediawiki/2017/ | + | 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; | ||
} | } | ||
− | # | + | #font h1 { |
− | font-family: 'Montserrat', sans-serif; | + | font-family: 'Montserrat', sans-serif !important; |
− | font-size: | + | 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; | ||
} | } | ||
− | + | .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 | + | 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; | ||
} | } | ||
− | + | .txt h2 { | |
font-family: 'Raleway', sans-serif; | font-family: 'Raleway', sans-serif; | ||
− | font-size: | + | 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 { | |
− | + | ||
font-family: 'Montserrat', sans-serif; | font-family: 'Montserrat', sans-serif; | ||
− | font-size: 24px | + | 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 { | |
− | + | 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 | + | 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(/ | + | 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: | ||
} | } | ||
/* 動畫 */ | /* 動畫 */ | ||
− | # | + | #font.tit h1 { |
text-align: center; | text-align: center; | ||
− | font-size: 80px | + | 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; | ||
} | } | ||
− | # | + | #font h1 { |
font-family: 'Montserrat', sans-serif; | font-family: 'Montserrat', sans-serif; | ||
− | font-size: 60px | + | 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; | ||
} | } | ||
− | + | .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 | + | 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; | ||
} | } | ||
− | + | .txt h2 { | |
font-family: 'Raleway', sans-serif; | font-family: 'Raleway', sans-serif; | ||
− | font-size: | + | 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 ; |
} | } | ||
− | + | .card .back h2 { | |
font-family: 'Montserrat', sans-serif; | font-family: 'Montserrat', sans-serif; | ||
− | font-size: 24px | + | font-size: 24px; |
font-weight: normal; | font-weight: normal; | ||
color: #f9cb8f; | color: #f9cb8f; | ||
Line 296: | Line 353: | ||
color: #f19181; | color: #f19181; | ||
} | } | ||
− | + | .card .back h5 { | |
font-family: 'Raleway', sans-serif; | font-family: 'Raleway', sans-serif; | ||
color: #555; | color: #555; | ||
− | font-size: 18px | + | 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(/ | + | 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: | ||
} | } | ||
/* 動畫 */ | /* 動畫 */ | ||
− | # | + | #font.tit h1 { |
text-align: center; | text-align: center; | ||
− | font-size: 120px | + | 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;*/ | |
} | } | ||
− | + | .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 | + | 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