Template:Team:HokkaidoU Japan/CSS

From 2014.igem.org

(Difference between revisions)
Line 749: Line 749:
}
}
-
/*Demo 4*/
+
/*Demo 3*/
@font-face {
@font-face {
font-family: 'arrows';
font-family: 'arrows';
Line 762: Line 762:
.bb-custom-wrapper {
.bb-custom-wrapper {
-
width: 100%;
+
width: 420px;
-
height: 100%;
+
position: relative;
position: relative;
 +
margin: 0 auto 40px;
 +
text-align: center;
}
}
.bb-custom-wrapper .bb-bookblock {
.bb-custom-wrapper .bb-bookblock {
-
width: 100%;
+
box-shadow: 0 12px 20px -10px rgba(81,64,49,0.6);
-
height: 100%;
+
-
-webkit-perspective: 2000px;
+
-
-moz-perspective: 2000px;
+
-
perspective: 2000px;
+
-
}
+
-
 
+
-
.bb-custom-side {
+
-
width: 50%;
+
-
float: left;
+
-
height: 100%;
+
-
overflow: hidden;
+
-
/* Centering with flexbox */
+
-
display: -webkit-box;
+
-
display: -moz-box;
+
-
display: -webkit-flex;
+
-
display: flex;
+
-
-webkit-flex-direction: row;
+
-
flex-direction: row;
+
-
-webkit-flex-wrap: wrap;
+
-
flex-wrap: wrap;
+
-
-webkit-box-pack: center;
+
-
-moz-box-pack: center;
+
-
-webkit-justify-content: center;
+
-
justify-content: center;
+
-
-webkit-box-align: center;
+
-
-moz-box-align: center;
+
-
-webkit-align-items: center;
+
-
align-items: center;
+
-
}
+
-
 
+
-
.bb-custom-firstpage h1 {
+
-
font-size: 2.625em;
+
-
line-height: 1.3;
+
-
margin: 0;
+
-
font-weight: 300;
+
-
}
+
-
 
+
-
.bb-custom-firstpage h1 span {
+
-
display: block;
+
-
font-size: 60%;
+
-
opacity: 0.3;
+
-
padding: 0 0 0.6em 0.1em;
+
-
}
+
-
 
+
-
.bb-custom-firstpage {
+
-
text-align: center;
+
-
padding-top: 15%;
+
-
width: 50%;
+
-
float: left;
+
-
height: 100%;
+
-
}
+
-
 
+
-
.bb-custom-side p {
+
-
padding: 8%;
+
-
font-size: 1.8em;
+
-
font-weight: 300;
+
}
}
Line 833: Line 778:
}
}
-
.bb-custom-wrapper > nav {
+
.bb-custom-wrapper nav {
width: 100%;
width: 100%;
-
height: 40px;
+
height: 30px;
margin: 1em auto 0;
margin: 1em auto 0;
-
position: fixed;
+
position: relative;
-
bottom: 20px;
+
z-index: 0;
-
z-index: 1000;
+
text-align: center;
text-align: center;
}
}
-
.bb-custom-wrapper > nav a {
+
.bb-custom-wrapper nav a {
display: inline-block;
display: inline-block;
-
width: 40px;
+
width: 30px;
-
height: 40px;
+
height: 30px;
text-align: center;
text-align: center;
border-radius: 2px;
border-radius: 2px;
-
background: #1baede;
+
background: #ea5381;
color: #fff;
color: #fff;
font-size: 0;
font-size: 0;
Line 855: Line 799:
}
}
-
.bb-custom-wrapper > nav a:hover {
+
.bb-custom-wrapper nav a:hover {
opacity: 0.6;
opacity: 0.6;
}
}
Line 867: Line 811:
text-transform: none;
text-transform: none;
line-height: 1;
line-height: 1;
-
font-size: 30px;
+
font-size: 20px;
-
line-height: 40px;
+
line-height: 30px;
display: block;
display: block;
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
Line 897: Line 841:
.no-js .bb-custom-content {
.no-js .bb-custom-content {
-
height: 100%;
+
height: 470px;
-
}
+
-
 
+
-
@media screen and (max-width: 61.75em){
+
-
.bb-custom-side {
+
-
font-size: 70%;
+
-
}
+
-
}
+
-
 
+
-
@media screen and (max-width: 33em){
+
-
.bb-custom-side {
+
-
font-size: 60%;
+
-
}
+
}
}

Revision as of 09:59, 11 September 2014