Template:Team:HokkaidoU Japan/About Us/CSS
From 2014.igem.org
(Difference between revisions)
(78 intermediate revisions not shown) | |||
Line 4: | Line 4: | ||
text-decoration: none; | text-decoration: none; | ||
} | } | ||
+ | |||
#team-picture { margin-top: 40px; } | #team-picture { margin-top: 40px; } | ||
#hokkaidou-contents .member { width: 100%; } | #hokkaidou-contents .member { width: 100%; } | ||
#hokkaidou-contents .member-header { width: 100%; height 40px; margin: 30px 0 20px; } | #hokkaidou-contents .member-header { width: 100%; height 40px; margin: 30px 0 20px; } | ||
#hokkaidou-contents .member-header h2 { font-size: 24px; line-height: 30px; } | #hokkaidou-contents .member-header h2 { font-size: 24px; line-height: 30px; } | ||
+ | #hokkaidou-contents .member-header2 h2 { font-size: 24px; line-height: 30px; } | ||
+ | #hokkaidou-contents .member-header3 h2 { font-size: 24px; line-height: 30px; } | ||
#hokkaidou-contents .member-list ul { list-style: none; margin: 0; } | #hokkaidou-contents .member-list ul { list-style: none; margin: 0; } | ||
- | #hokkaidou-contents .member-list ul li { float: left; width: | + | #hokkaidou-contents .member-list ul li { float: left; width: 130px; height: 130px; margin: 10px 7px 60px 7px; position: relative; top:0px;} |
- | #hokkaidou-contents .member-list ul li img { width: | + | #hokkaidou-contents .member-list ul li img { width: 130px; height: 130px; position: relative;} |
- | #hokkaidou-contents .member-list ul li h3 { font-size: 24px; line-height: 30px; position: | + | #hokkaidou-contents .member-list ul li h3 { font-size: 24px; line-height: 30px; position: relative; top: 20px; margin: 0; top: 12px; color: white; text-align: center;} |
- | #hokkaidou-contents .member-list ul li p { font-size: | + | #hokkaidou-contents .member-list ul li p { font-size: 16px; line-height: 25px; position: relative; margin: 0 auto; width: 80%; overflow: auto; text-align: left; |
+ | top: 15px;} | ||
#hokkaidou-contents .member-list ul li p:first-letter { margin: 0;} | #hokkaidou-contents .member-list ul li p:first-letter { margin: 0;} | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
#sponsor-list { list-style: none; position: relative; height: 200px; margin: 0;} | #sponsor-list { list-style: none; position: relative; height: 200px; margin: 0;} | ||
#sponsor-list li { position: absolute; } | #sponsor-list li { position: absolute; } | ||
#sponsor-list li:nth-child(1) { top: 20px; left: 40px; } | #sponsor-list li:nth-child(1) { top: 20px; left: 40px; } | ||
- | #sponsor-list li:nth-child(2) { top: 20px; left: | + | #sponsor-list li:nth-child(2) { top: 20px; left: 300px; } |
- | #sponsor-list li:nth-child(3) { top: 20px; left: | + | #sponsor-list li:nth-child(3) { top: 20px; left: 520px; } |
- | #sponsor-list li:nth-child(4) { top: | + | #sponsor-list li:nth-child(4) { top: 120px; right: 200px; } |
- | #sponsor-list li:nth-child(5) { top: 120px; left: | + | #sponsor-list li:nth-child(5) { top: 120px; left: 70px; } |
- | #sponsor-list li:nth-child(6) { top: 120px; left: | + | #sponsor-list li:nth-child(6) { top: 120px; left: 305px; } |
#sponsor-list li:nth-child(7) { top: 120px; left: 560px; } | #sponsor-list li:nth-child(7) { top: 120px; left: 560px; } | ||
#sponsor-list li:nth-child(8) { top: 120px; right: 40px; } | #sponsor-list li:nth-child(8) { top: 120px; right: 40px; } | ||
Line 36: | Line 35: | ||
} | } | ||
- | + | .member-header2 { | |
+ | margin-top: 50px; | ||
+ | } | ||
+ | .member-header3 { | ||
+ | margin-top: 50px; | ||
+ | position: relative; | ||
+ | top:0px; | ||
+ | } | ||
+ | |||
+ | #member-instructor { | ||
} | } | ||
Line 44: | Line 52: | ||
#member-undergrad { | #member-undergrad { | ||
+ | } | ||
+ | |||
+ | .show{ | ||
+ | cursor: pointer; | ||
+ | position: absolute; | ||
+ | } | ||
+ | |||
+ | .overlay{ | ||
+ | opacity:1; | ||
+ | background: black; | ||
+ | color: white; | ||
+ | height: 240px; | ||
+ | position: relative; | ||
+ | width:400px; | ||
+ | display:none; | ||
+ | top: 6px; | ||
+ | right:130px; | ||
+ | z-index:5; | ||
} | } | ||
+ | .overlay::before { | ||
+ | content: ""; | ||
+ | display: inline-block; | ||
+ | border: 8px solid transparent; | ||
+ | border-bottom-color: #000; | ||
+ | position: relative; | ||
+ | left: 45%; | ||
+ | top: -6px; | ||
+ | margin-top: -8px; | ||
+ | z-index:5; | ||
} | } | ||
+ | |||
+ | .overlay-content { | ||
+ | color: white; | ||
+ | position: relative; | ||
+ | margin: 40px auto; | ||
+ | width:100%; | ||
+ | text-align:center; | ||
+ | top:-40px; | ||
+ | } | ||
+ | |||
+ | |||
+ | |||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 17:38, 11 October 2014