Template:Team:HokkaidoU Japan/About Us/CSS

From 2014.igem.org

(Difference between revisions)
 
(71 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: 400px; height: 200px; margin: 20px 20px 20px 20px; 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: 13px; line-height: 20px; position: absolute; top: 60px; width: 260px; overflow: auto;}
+
#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: 400px; }
+
#sponsor-list li:nth-child(2) { top: 20px; left: 300px; }
-
#sponsor-list li:nth-child(3) { top: 20px; left: 700px; }
+
#sponsor-list li:nth-child(3) { top: 20px; left: 520px; }
-
#sponsor-list li:nth-child(4) { top: 120px; right: 10px; }
+
#sponsor-list li:nth-child(4) { top: 120px; right: 200px; }
-
#sponsor-list li:nth-child(5) { top: 120px; left: 80px; }
+
#sponsor-list li:nth-child(5) { top: 120px; left: 70px; }
-
#sponsor-list li:nth-child(6) { top: 120px; left: 400px; }
+
#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 34: Line 33:
.member-category {
.member-category {
     margin: 40px;
     margin: 40px;
 +
}
 +
 +
.member-header2 {
 +
    margin-top: 50px;
 +
}
 +
 +
.member-header3 {
 +
    margin-top: 50px;
 +
    position: relative;
 +
    top:0px;
}
}
Line 46: Line 55:
-
#show{
+
.show{
     cursor: pointer;
     cursor: pointer;
     position: absolute;
     position: absolute;
}
}
   
   
-
#overlay{
+
.overlay{
-
     opacity:0.7;
+
     opacity:1;
     background: black;
     background: black;
     color: white;
     color: white;
-
     height: 30%;
+
     height: 240px;
-
     position: absolute;
+
     position: relative;
-
     width:100%;
+
     width:400px;
     display:none;
     display:none;
 +
    top: 6px;
 +
    right:130px;
 +
    z-index:5;
}
}
-
+
 
-
#overlay-content{
+
.overlay::before {
-
    border: white solid 1px;
+
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;
     color: white;
-
     left: 30%;
+
     position: relative;
-
     position: absolute;
+
     margin: 40px auto;
-
     top: 30%;
+
     width:100%;
-
     width: 50%;
+
     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"