Template:Team:HokkaidoU Japan/About Us/CSS

From 2014.igem.org

(Difference between revisions)
 
(80 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<style type="text/css">
<style type="text/css">
-
h1 {
+
h1 h2 h3 h4 h5  {
     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: 360px; height: 150px; margin: 10px 40px; position: relative; }
+
#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: 100px; height: 100px; position: absolute; top: 0;}
+
#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: absolute; top: 20px; margin: 0;}
+
#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: 14px; line-height: 20px; position: absolute; top: 60px; width: 260px;}
+
#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;}
-
#hokkaidou-contents .member-list ul li:nth-child(even) img { right: 0; }
+
 
-
#hokkaidou-contents .member-list ul li:nth-child(odd) img { left: 0; }
+
-
#hokkaidou-contents .member-list ul li:nth-child(even) h3 { left: 0; text-align: left;}
+
-
#hokkaidou-contents .member-list ul li:nth-child(odd) h3 { right: 0; text-align: right;}
+
-
#hokkaidou-contents .member-list ul li:nth-child(even) p { left: 0; text-align: left;}
+
-
#hokkaidou-contents .member-list ul li:nth-child(odd) p { right: 0; text-align: right;}
+
#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: 290px; }
+
#sponsor-list li:nth-child(2) { top: 20px; left: 300px; }
-
#sponsor-list li:nth-child(3) { top: 20px; left: 500px; }
+
#sponsor-list li:nth-child(3) { top: 20px; left: 520px; }
-
#sponsor-list li:nth-child(4) { top: 20px; right: 40px; }
+
#sponsor-list li:nth-child(4) { top: 120px; right: 200px; }
-
#sponsor-list li:nth-child(5) { top: 120px; left: 40px; }
+
#sponsor-list li:nth-child(5) { top: 120px; left: 70px; }
-
#sponsor-list li:nth-child(6) { top: 120px; left: 260px; }
+
#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-instructor {
+
.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

Retrieved from "http://2014.igem.org/Template:Team:HokkaidoU_Japan/About_Us/CSS"