Team:CityU HK/Template/CSS

From 2014.igem.org

(Difference between revisions)
 
(136 intermediate revisions not shown)
Line 11: Line 11:
      
      
     <!-- font -->
     <!-- font -->
-
     <link href='http://fonts.googleapis.com/css?family=Raleway:400,900,100' rel='stylesheet' type='text/css'>
+
     <link href='http://fonts.googleapis.com/css?family=Raleway:100,300,400,500,600,700,900,100' rel='stylesheet' type='text/css'>
     <link href='http://fonts.googleapis.com/css?family=Dosis:200,400,700' rel='stylesheet' type='text/css'>
     <link href='http://fonts.googleapis.com/css?family=Dosis:200,400,700' rel='stylesheet' type='text/css'>
 +
    <link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>
 +
    <link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
    
    
Line 74: Line 76:
background-color: transparent;
background-color: transparent;
}
}
 +
#globalWrapper, #content { /*-- changes default wiki settings --*/
#globalWrapper, #content { /*-- changes default wiki settings --*/
Line 98: Line 101:
                 font-family: 'Raleway', sans-serif;
                 font-family: 'Raleway', sans-serif;
         }
         }
 +
.navbar-default {
.navbar-default {
border-bottom: solid 3px #e0e0e0;
border-bottom: solid 3px #e0e0e0;
-
margin-bottom:0;
+
margin:0;
                 height: 8%;
                 height: 8%;
}
}
.navbar-brand {
.navbar-brand {
-
font-family:'Raleway', sans-serif;
+
font-family: 'Indie Flower', cursive;
-
font-size: 1.7em;
+
                font-weight: bold;
 +
font-size: 1.8em;
padding-top: 40px;
padding-top: 40px;
padding-left: 2px;
padding-left: 2px;
padding-bottom: 70px;
padding-bottom: 70px;
}
}
 +
 +
        #igem {
 +
                position: relative;
 +
                top: -22px;
 +
        }
          
          
         .nav .navbar-brand a:link {          /*overwrite igem default style*/
         .nav .navbar-brand a:link {          /*overwrite igem default style*/
Line 132: Line 142:
     .nav.navbar-nav.navbar-right a:hover {     
     .nav.navbar-nav.navbar-right a:hover {     
         color:#3cc;
         color:#3cc;
 +
        background: none;
     }
     }
Line 154: Line 165:
border: none;
border: none;
color: #3cc;
color: #3cc;
-
/*font-weight: bold;*/
+
/*font-weight:bold;*/
         background: none;
         background: none;
}
}
-
/*.carousel-inner {
 
-
-webkit-box-shadow: 0 8px 6px -6px black;
 
-
-moz-box-shadow: 0 8px 6px -6px black;
 
-
box-shadow: 0 8px 6px -6px black;*/
 
-
}
 
-
 
-
.carousel-inner .carousel-caption {
 
-
padding-top: 100px;
 
-
padding-bottom: 100px;
 
-
}
 
-
.carousel-inner .carousel-caption h1 {
 
-
font-family: 'Raleway', cursive;
 
-
font-size: 80px;
 
-
padding-bottom:10px;
 
-
}
 
-
 
-
.carousel-inner .carousel-caption h3 {
 
-
font-size: 60px;
 
-
font-family: 'Raleway', sans-serif;
 
-
        padding-bottom: 5px;
 
-
}
 
-
 
-
.btn-custom {
 
-
padding: 9px 30px 9px 30px;
 
-
        /*box-shadow: 0px 3px 3px 3px rgba(5,170,139, 0.3);
 
-
          -webkit-box-shadow: 0px 3px 3px 0 rgba(5,170,139, 1);
 
-
          -moz-box-shadow:    0px 3px 3px 0 rgba(5,170,139, 1);*/
 
-
font-family: 'Quattrocento Sans', sans-serif;
 
-
font-size: 20px;
 
-
}
 
-
 
-
.btn-custom:link {
 
-
        font-weight: bold;                     
 
-
        color: #fff;
 
-
        background-color: #4eecba;
 
-
}
 
-
 
-
.btn-custom:hover {
 
-
color: #fff;
 
-
        background-color: orange;
 
-
        border: none;
 
-
}
 
-
 
-
#feature-icon img {
 
-
        max-width: 100%;
 
-
        max-height: 100%;
 
-
}
 
-
 
-
#abstract {
 
-
background: #CBEBE3;
 
-
 
-
}
 
-
 
-
#abstract h2{
 
-
text-align: center;
 
-
        font-size: 5em;
 
-
font-family: 'Raleway', sans-serif;
 
-
padding-top: 50px;
 
-
        margin-left:200px;
 
-
        margin-right:200px;
 
-
}
 
-
 
-
#abstract p {
 
-
        color: #666;
 
-
        font-weight: 400;
 
-
        font-family: 'Raleway', sans-serif;
 
-
line-height: 2em;
 
-
text-align: center;
 
-
padding-left: 200px;
 
-
padding-right:200px;
 
-
padding-top: 10px;
 
-
padding-bottom: 100px;
 
-
        font-size: 18px;
 
-
}
 
#footer {
#footer {
background: rgba(0,0,0,0.8);
background: rgba(0,0,0,0.8);
background-size:cover;
background-size:cover;
-
height: 200px;
 
         width: 100%;
         width: 100%;
clear: both;
clear: both;
-
bottom: 0;
+
/*top: 0;*/
         margin: 0;
         margin: 0;
-
         padding: 20px 20px 0px 20px;  
+
         padding: 10px 20px 0px 20px;  
         border-top: solid 1px #e0e0e0;
         border-top: solid 1px #e0e0e0;
-
        position: relative;
+
      /* position: relative;*/
}
}
-
#footer h4 {
+
#footer h3 {
-
color: #fff;
+
color: #dde0e4;
 +
        font-family: 'Raleway', sans-serif;
 +
        font-size: 18px;
 +
        font-weight: bold;
 +
        padding-bottom: 20px;
}
}
#footer p {
#footer p {
-
color: #fff;
+
color: #777777;
text-align: center;
text-align: center;
 +
        font-size: 14px;
 +
}
 +
 +
#footer #email {
 +
      font-size: 18px;
}
}
#footer a {
#footer a {
-
color: #fff;
+
color: #777777;
text-decoration: none;
text-decoration: none;
}
}
Line 270: Line 215:
margin-bottom: 10px;
margin-bottom: 10px;
}
}
 +
 +
#copyright {
 +
        width:100%;
 +
        padding-top:10px;
 +
        padding-bottom: 10px;
 +
        background: rgba(0,0,0,0.8);
 +
        color: #777777;
 +
        font-family: 'Raleway', sans-serif;
 +
        font-size: 14px;
 +
        text-align: center;
 +
}
 +
@media screen and (max-width: 480px) {
@media screen and (max-width: 480px) {
Line 282: Line 239:
         #abstract h2 {
         #abstract h2 {
 +
        font-size: 2em;
 +
        padding-top: 10px;
 +
        padding-bottom: 10px;
         margin-left: 30px;
         margin-left: 30px;
         margin-right: 30px;}
         margin-right: 30px;}
Line 288: Line 248:
         padding-left: 10px;
         padding-left: 10px;
         padding-right: 10px;
         padding-right: 10px;
 +
        font-weight: 300;
         font-size: 14px;}
         font-size: 14px;}
 +
 +
      #footer {
 +
      height: 500px;}
         #footer img {
         #footer img {
Line 298: Line 262:
         #navbar-brand {
         #navbar-brand {
         Font-size:25px;}
         Font-size:25px;}
 +
 +
        #abstract p {
 +
        padding-left: 10px;
 +
        padding-right: 10px;
 +
 +
      #footer {
 +
      height: 500px;}
 +
</style>
</style>
</html>
</html>

Latest revision as of 00:33, 18 October 2014

Bootstrap 101 Template