Difference between revisions of "Team:CityU HK/Template/CSS"

 
(17 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 +
<style type="text/css">
 +
  
−
    <meta charset="utf-8">
 
−
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
−
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
−
    <title>Bootstrap 101 Template</title>
 
  
−
    <!-- Bootstrap -->
 
−
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
 
−
    <link href='http://fonts.googleapis.com/css?family=Quattrocento+Sans' rel='stylesheet' type='text/css'>
 
−
   
 
−
    <!-- font -->
 
−
    <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=Lobster' rel='stylesheet' type='text/css'>
 
−
    <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:700' rel='stylesheet' type='text/css'>
 
−
 
 
  
−
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
 
−
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 
−
    <!--[if lt IE 9]>
 
−
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
 
−
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
 
−
    <![endif]-->
 
  
  
−
<style type="text/css">
 
  
−
/* Removing wiki-like stuff */
+
/* Resets
−
/****************************/
+
--------------------------------------------------------------------------------*/
−
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .firstHeading,.visualClear {display: none;}
+
−
/****************************/
+
  
−
#top-section {    /*-- styling for default menu bar (edit, page, history, etc.) --*/
+
ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote,  
−
background-color: #383838;
+
fieldset, input {
−
border: 0 none;
+
margin: 0;
−
        height: 0px;
+
padding: 0;
−
        color: transparent;
+
−
z-index: 100;
+
−
top: 0;
+
−
position: fixed;
+
−
width: 975px;
+
−
left: 50%;
+
−
margin-left: -487px;
+
 
}
 
}
  
−
#top-section:hover {  
+
a img {
−
background-color: #383838;
+
border: 0;
−
border: 0 none;
+
−
        height: 14px;
+
−
z-index: 100;
+
−
top: 0;
+
−
width: 975px;
+
−
left: 50%;
+
−
margin-left: -487px;
+
−
        -webkit-transition: all 0s linear .1s;
+
−
-moz-transition: all 0s linear .1s;
+
−
-ms-transition: all 0s linear .1s;
+
−
-o-transition: all 0s linear .1s;
+
−
transition: all 0s linear .1s;
+
 
}
 
}
  
−
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
+
a {
−
background-color: #383838;
+
text-decoration: none;
−
height: 14px;
+
}
 +
 
 +
/* General Styling and Structure
 +
--------------------------------------------------------------------------------*/
 +
 
 +
body {
 +
font-family: Georgia, serif;
 +
font-size: 14px;
 +
background: #F2F2F2;
 +
color: #555;
 +
line-height:24px;
 +
}
 +
 
 +
.container {
 +
margin: 0 auto;
 +
width: 1200px;
 +
padding:0 7px;
 +
background:#FFFFFF;
 +
}
 +
 
 +
#header-wrap,
 +
#banner-wrap,
 +
#nav-wrap,
 +
#main-wrap,
 +
#footer-wrap
 +
{
 +
        width:100%;
 +
}
 +
 
 +
#main-wrap .container {min-height:450px;}
 +
 
 +
h3 {
 +
font-size: 22px;
 +
padding: .2em 0 .2em 0;
 +
line-height: 1.2;
 +
font-weight: normal;
 +
letter-spacing: -1px;
 +
color: #333;
 +
margin-bottom:20px;
 +
}
 +
 
 +
a {
 +
color: #C13832;
 +
}
 +
 
 +
a:hover {
 +
color: $HoverColor;
 +
}
 +
 
 +
h2 {
 +
font-size: 19px;
 +
padding: .8em 0 .2em 0;
 +
line-height: 1.2;
 +
font-weight: normal;
 +
color: #333;
 +
margin-bottom:20px;
 +
}
 +
 
 +
.weebly-text h1, h2, h3, h4, h5, h6 {font-family: Georgia, serif;}
 +
 
 +
p, blockquote {
 +
color:#777;
 +
font: 12px/22px Arial,sans-serif;
 +
}
 +
 
 +
blockquote {
 +
color:#aaa;
 +
}
 +
 
 +
 
 +
 
 +
/* Header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#nav-wrap .container,
 +
#nav-wrap .container table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
width:1200px;
 +
}
 +
 
 +
#wsite-title {
 +
    font-size:20px;
 +
color:#555;
 +
line-height:38px;
 +
float:left;
 +
font-style:italic;
 +
font-weight:bold;
 +
}
 +
 
 +
#wsite-title:hover {
 +
color:$HoverColor;
 +
}
 +
 
 +
#header {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
text-align:right;
 +
height:100px;
 +
    width:100%;
 +
}
 +
 
 +
#header,
 +
#header table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
}
 +
 
 +
#header td {
 +
vertical-align: middle;
 +
text-align: left;
 +
}
 +
 
 +
#header-right {
 +
border-spacing:0;
 +
padding:0;
 +
}
 +
 
 +
#header-right table {
 +
float:right;
 +
width:1px;
 +
}
 +
 
 +
#header-right td {
 +
padding: 0 0 0 0;
 +
}
 +
 
 +
/* Header: Phone Number
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .phone-number .wsite-text {
 +
font-weight: 300;
 +
font-size:13px;
 
display: block;
 
display: block;
−
z-index: 10;
+
white-space: nowrap;
−
position: fixed;
+
line-height: 31px;
−
width: 100%;
+
margin: 0 0 0 10px;
−
top: 0;
+
text-align: right;
 
}
 
}
  
−
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
+
#header-right .phone-number .wsite-text a {}
−
color: #727272;
+
#header-right .phone-number .wsite-text a:hover {}
−
text-decoration: none;  
+
 
−
background-color: transparent;
+
/* Header: Social Links
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .wsite-social {
 +
vertical-align: middle;
 +
margin-left:15px;
 
}
 
}
  
  
−
#globalWrapper, #content { /*-- changes default wiki settings --*/
+
.wsite-social-item {
−
width: 100%;  
+
width: 28px;
−
height: 100%;
+
height: 30px;
−
border: 0px;
+
margin: 1px 0 0 4px;
−
background-color: transparent;
+
−
margin: 0px;
+
−
padding: 0px;
+
 
}
 
}
  
−
html, body, .wrapper { /*-- changes default wiki settings --*/
+
.wsite-social-rss {
−
width: 100%;
+
background: url(social-icons.png) no-repeat -130px 0px;
−
height: 100%;
+
−
background-color: transparent;
+
 
}
 
}
  
−
h2 {border-bottom: none;}
+
.wsite-social-rss:hover {
−
h1 {border-bottom: none;}
+
background-position: -130px -30px;
−
h3 {border-bottom: none;}
+
}
−
a:link {color: none;}
+
  
−
        h1, h2, h3, p {
+
.wsite-social-rss:active {
−
                font-family: 'Raleway', sans-serif;
+
background-position: -130px -60px;
−
        }
+
}
  
 +
.wsite-social-linkedin {
 +
background: url(social-icons.png) no-repeat -65px 0px;
 +
}
  
−
.navbar-default {
+
.wsite-social-linkedin:hover {
−
/*background-color: #f9fccb ;*/
+
background-position: -65px -30px;
−
/*border-bottom: solid 3px #f40000;*/
+
}
−
margin:0;
+
−
                height: 8%;
+
−
}
+
−
+
−
.navbar-brand {
+
−
font-family: 'Roboto Condensed', sans-serif;
+
−
                font-weight: bold;
+
−
font-size: 3.0em;
+
−
padding-top: 40px;
+
−
padding-left: 20px;
+
−
padding-bottom: 70px;
+
−
}
+
  
−
        #igem {
+
.wsite-social-linkedin:active {
−
                position: relative;
+
background-position: -65px -60px;
−
                top: -22px;
+
}
−
        }
+
−
       
+
−
        .nav .navbar-brand a:link {          /*overwrite igem default style*/
+
−
                color: #bebebe;
+
−
        }
+
  
−
.navbar-brand:hover {
+
.wsite-social-facebook {
−
color:#3cc;
+
background: url(social-icons.png) no-repeat 0px 0px;
−
}
+
−
+
−
    .navbar .container-fluid #bs-example-navbar-collapse-1 .nav.navbar-nav.navbar-right {
+
−
margin-top: 20px;
+
−
font-size: 14px;
+
−
font-family:'Raleway', sans-serif;
+
 
}
 
}
−
    .nav.navbar-nav.navbar-right a:link {    /*overwrite igem default style*/
 
−
        color:#357385;
 
−
    }
 
  
−
    .nav.navbar-nav.navbar-right a:hover {  
+
.wsite-social-facebook:hover {
−
        color:#3cc;
+
background-position: 0px -30px;
−
        background: none;
+
}
−
    }
+
  
−
    .nav.navbar-nav.navbar-right .active a {
+
.wsite-social-facebook:active {
−
        background: none;
+
background-position: 0px -60px;
−
border-bottom-width: 3px;
+
−
border-bottom-style: solid;
+
−
border-bottom-color: #4eecba;
+
 
}
 
}
  
−
nav li a:hover {
+
.wsite-social-twitter {
−
color: #3cc;
+
background: url(social-icons.png) no-repeat -32px 0px;
−
        background-color: transparent;
+
 
}
 
}
  
−
.dropdown li a: hover {
+
.wsite-social-twitter:hover {
−
        background-color: transparent;
+
background-position: -32px -30px;
 +
}
  
 +
.wsite-social-twitter:active {
 +
background-position: -32px -60px;
 
}
 
}
  
−
.dropdown-menu li a:hover {
+
.wsite-social-mail {
 +
background: url(social-icons.png) no-repeat -97px 0px;
 +
}
 +
 
 +
.wsite-social-mail:hover {
 +
background-position: -97px -30px;
 +
}
 +
 
 +
.wsite-social-mail:active {
 +
background-position: -97px -60px;
 +
}
 +
 
 +
.wsite-social-pinterest {
 +
background: url(social-icons.png) no-repeat -227px 0px;
 +
}
 +
 
 +
.wsite-social-pinterest:hover {
 +
background-position: -227px -30px;
 +
}
 +
 
 +
.wsite-social-pinterest:active {
 +
background-position: -227px -60px;
 +
}
 +
 
 +
.wsite-social-youtube {
 +
background: url(social-icons.png) no-repeat -325px 0px;
 +
}
 +
 
 +
.wsite-social-youtube:hover {
 +
background-position: -325px -30px;
 +
}
 +
 
 +
.wsite-social-youtube:active {
 +
background-position: -325px -60px;
 +
}
 +
 
 +
.wsite-social-plus {
 +
background: url(social-icons.png) no-repeat -195px 0px;
 +
}
 +
 
 +
.wsite-social-plus:hover {
 +
background-position: -195px -30px;
 +
}
 +
 
 +
.wsite-social-plus:active {
 +
background-position: -195px -60px;
 +
}
 +
 
 +
.wsite-social-flickr {
 +
background: url(social-icons.png) no-repeat -162px 0px;
 +
}
 +
 
 +
.wsite-social-flickr:hover {
 +
background-position: -162px -30px;
 +
}
 +
 
 +
.wsite-social-flickr:active {
 +
background-position: -162px -60px;
 +
}
 +
 
 +
.wsite-social-vimeo {
 +
background: url(social-icons.png) no-repeat -260px 0px;
 +
}
 +
 
 +
.wsite-social-vimeo:hover {
 +
background-position: -260px -30px;
 +
}
 +
 
 +
.wsite-social-vimeo:active {
 +
background-position: -260px -60px;
 +
}
 +
 
 +
.wsite-social-yahoo {
 +
background: url(social-icons.png) no-repeat -292px 0px;
 +
}
 +
 
 +
.wsite-social-yahoo:hover {
 +
background-position: -292px -30px;
 +
}
 +
 
 +
.wsite-social-yahoo:active {
 +
background-position: -292px -60px;
 +
}
 +
 
 +
/* Header: Search Box
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .search {
 +
width:182px;
 +
vertical-align: middle;
 +
}
 +
 
 +
#header-right .wsite-search {
 +
vertical-align: middle;
 +
margin-left:15px;
 +
width:182px;
 +
height:28px;
 +
background:url(search-bg.gif) no-repeat top left;
 +
}
 +
 
 +
#header-right .wsite-search-input {
 +
width: 145px;
 
border: none;
 
border: none;
−
color: #3cc;
+
padding: 6px !important;
−
/*font-weight:bold;*/
+
color: #999999;
−
        background: none;
+
font-size: 12px ;
 +
background: none;
 +
height:auto !important;
 
}
 
}
  
 +
#header-right .wsite-search-button {
 +
position: relative;
 +
width: 14px;
 +
height: 14px;
 +
border: 0px;
 +
margin: 7px 0px 0px 5px;
 +
padding: ;
 +
background: url(search-button.gif) no-repeat right center;
 +
}
  
 +
/* Navigation
 +
--------------------------------------------------------------------------------*/
  
−
#footer {
+
#nav-wrap .container {
−
background: rgba(0,0,0,0.8);
+
−
background-size:cover;
+
−
        width: 100%;
+
 
clear: both;
 
clear: both;
−
/*top: 0;*/
+
overflow: hidden;
−
        margin: 0;
+
position: relative;
−
        padding: 10px 20px 0px 20px;
+
−
        border-top: solid 1px #e0e0e0;
+
−
      /* position: relative;*/
+
 
}
 
}
  
−
#footer h3 {
+
#nav-wrap .container table, #nav-wrap .container table tr, #nav-wrap .container table tr td, #nav-wrap .container table tbody {
−
color: #dde0e4;
+
vertical-align:bottom;
−
        font-family: 'Raleway', sans-serif;
+
−
        font-size: 18px;
+
−
        font-weight: bold;
+
−
        padding-bottom: 20px;
+
 
}
 
}
  
−
#footer p {
+
td#nav {
−
color: #777777;
+
float:right;
−
text-align: center;
+
border-spacing:0;
−
        font-size: 14px;
+
}
 +
#navigation {
 +
line-height: 1;
 +
float: right;
 
}
 
}
  
−
#footer #email {
+
#navigation ul {
−
      font-size: 18px;
+
list-style: none;
 +
float: left;
 +
width:1200px;
 +
height:44px;
 +
margin-bottom:-1px;
 
}
 
}
  
−
#footer a {
+
#navigation li {
−
color: #777777;
+
display: inline;
 +
position: relative;
 +
list-style: none;
 +
float: left;
 +
margin:0 0 0 5px;
 +
}
 +
 
 +
#navigation li.wsite-nav-0 {margin-left:0;}
 +
 
 +
#navigation ul li a {
 +
display: block;
 +
color: #333;
 
text-decoration: none;
 
text-decoration: none;
 +
padding:4px 0 4px 0;
 +
margin:0;
 +
width:100px;
 +
border: 0;
 +
outline: 0;
 +
list-style-type: none;
 +
box-sizing:border-box;
 +
float: left;
 +
font:10px Georgia, serif;
 +
border-top:4px solid #939598;
 
}
 
}
  
−
#footer a:hover {
+
#navigation ul li#active a{
−
color: #3cc;
+
border-top:4px solid #C13832;
 +
color:#000;
 
}
 
}
  
−
#footer img {
+
#navigation ul li a:hover {
−
margin-left: 40px;
+
border-top:4px solid #404041;
−
margin-top: 30px;
+
color: #666;
−
margin-bottom: 10px;
+
 
}
 
}
  
−
#copyright {
+
/* Navigation Submenu's
−
        width:100%;
+
--------------------------------------------------------------------------------*/
−
        padding-top:10px;
+
 
−
        padding-bottom: 10px;
+
#wsite-menus .wsite-menu {
−
        background: rgba(0,0,0,0.8);
+
background:#fff;
−
        color: #777777;
+
box-shadow:0 1px 7px rgba(0,0,0,0.1);
−
        font-family: 'Raleway', sans-serif;
+
position:relative;
−
        font-size: 14px;
+
−
        text-align: center;
+
 
}
 
}
  
  
−
@media screen and (max-width: 480px) {
+
#wsite-menus .wsite-menu li a {
−
        .navbar-default {
+
background: #F4F4F4;
−
        height: auto;}
+
border:none;
 +
border-bottom: 1px solid #E8E8E8;
 +
border-top: 1px solid white;
 +
display: block;
 +
}
  
−
        /*.navbar-brand span{
+
#wsite-menus .wsite-menu li a:hover {
−
        display: none;}*/
+
color: #C13832;
−
+
background: #eee;
−
        .carousel-inner {
+
}
−
        height:auto;}
+
  
−
        #abstract h2 {
 
−
        font-size: 2em;
 
−
        padding-top: 10px;
 
−
        padding-bottom: 10px;
 
−
        margin-left: 30px;
 
−
        margin-right: 30px;}
 
−
 
−
        #abstract p {
 
−
        padding-left: 10px;
 
−
        padding-right: 10px;
 
−
        font-weight: 300;
 
−
        font-size: 14px;}
 
−
 
−
      #footer {
 
−
      height: 500px;}
 
  
−
        #footer img {
+
 
−
        width: 30px;
+
/* Universal banner
−
        height: 30px;}
+
--------------------------------------------------------------------------------*/
 +
 
 +
#banner {
 +
position:relative;
 
}
 
}
  
−
@media screen and （max-width： 800px）｛
+
#banner-image-wrap {
−
        #navbar-brand ｛
+
position:relative
−
        Font-size：25px；｝
+
}
  
−
        #abstract p {
+
/* Page type: Tall header
−
         padding-left: 10px;
+
--------------------------------------------------------------------------------*/
−
        padding-right: 10px;
+
 
 +
 
 +
.tall-header-page #banner-image-wrap {
 +
width: 100%;
 +
height: 650px;
 +
}
 +
 
 +
.tall-header-page .wsite-header {
 +
width: 100%;
 +
height: 650px;
 +
background: url(banner-tall.jpg) no-repeat;
 +
}
 +
 
 +
/* Page type: Short header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
 
 +
.short-header-page #banner-image-wrap {
 +
width: 100%;
 +
height: 100px;
 +
}
 +
 
 +
.short-header-page .wsite-header {
 +
width: 100%;
 +
height: 100px;
 +
background: url(banner-short.jpg) no-repeat;
 +
}
 +
 
 +
/* Page type: No header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.no-header-page #banner, .no-header-page .wsite-header  {
 +
         display:none;
 +
}
 +
 
 +
/* Page type: Landing page
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.landing-page #banner {}
 +
 
 +
#bannerleft {
 +
width: 1200px;
 +
height: 400px;
 +
float:right;
 +
position:relative;
 +
}
 +
 
 +
.landing-page .wsite-header {
 +
width: 100%;
 +
height: 400px;
 +
background: url(banner-tall.jpg) no-repeat;
 +
}
 +
 
 +
#bannerright {
 +
width: 420px;
 +
text-align:left;
 +
position:absolute;
 +
z-index:4;
 +
bottom:30px;
 +
right:30px;
 +
padding:23px 20px 20px;
 +
background:#C13832;
 +
}
 +
 
 +
#bannerright h2 {
 +
color: #fff;
 +
font:bold italic 24px Georgia, serif;
 +
padding: 0px;
 +
line-height: 24px;
 +
margin:0px;
 +
}
 +
 
 +
#bannerright .anchor {
 +
position:absolute;
 +
background:#C13832;
 +
width:30px;
 +
height:7px;
 +
bottom:-7px;
 +
left:-30px;
 +
}
 +
#bannerright p {
 +
padding: 20px 0px;
 +
line-height: 140%;
 +
color:#fff;
 +
font: 14px/19px Georgia, serif;
 +
}
 +
#bannerright p a, #bannerright h2 a {
 +
color:#fff;
 +
text-decoration:underline;
 +
}
 +
 
 +
.landing-banner-outer {
 +
display: table;
 +
#position: relative;
 +
overflow: hidden;
 +
}
 +
 
 +
.landing-banner-mid {
 +
#position: absolute;
 +
#top: 50%;
 +
display: table-cell;
 +
vertical-align: middle;
 +
}
 +
 
 +
.landing-banner-inner {
 +
#position: relative;
 +
#top: -50%;
 +
}
 +
 
 +
/* Main Content
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#main-wrap .container {
 +
min-height:400px;
 +
padding-top:10px;
 +
padding-bottom:20px;
 +
}
 +
 
 +
#main-wrap .container h2 {
 +
margin-bottom:10px;
 +
}
 +
 
 +
#main-wrap .container blockquote {
 +
font-family: 'Droid Serif', serif;
 +
font-style: italic;
 +
color:# 777777;
 +
padding-left:15px;
 +
border-left:3px solid #eeeeee;
 +
margin: 15px 0px;
 +
}
 +
 
 +
#main-wrap .container form .wsite-button {
 +
margin-top:50px;
 +
}
 +
 
 +
/* Footer
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#footer-wrap {
 +
margin-top:25px;
 +
}
 +
#footer-wrap .container {
 +
text-align:left;
 +
padding:0 0px 20px;
 +
text-align:right;
 +
background:none;
 +
}
 +
 
 +
#footer-wrap ul {
 +
text-align:left;
 +
}
 +
 
 +
 
 +
#footer-wrap h2 {
 +
font-size: 19px;
 +
padding-bottom:10px;
 +
margin:0;
 +
font-weight: normal;
 +
color:#333;
 +
}
 +
 
 +
#footer-wrap span {
 +
vertical-align: middle;
 +
}
 +
 
 +
/* Form Customization
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.wsite-form-label {
 +
display: inline-block;
 +
color: #797979;
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 1em;
 +
padding: 6px 0 0px 0;
 +
}
 +
 
 +
.form-radio-container {
 +
color: #797979;
 +
font-size: 1em;
 +
font-family: Arial, Helvetica, sans-serif;
 +
}
 +
 
 +
.wsite-form-input, .wsite-search-element-input {
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 1em;
 +
color: #797979;
 +
background: #fff url(field.png) repeat-x;
 +
border: 1px solid #d4d4d4;
 +
padding: 8px 4px 5px !important;
 +
line-height: 1;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
border-radius: 3px;
 +
}
 +
 
 +
.form-select {
 +
color: #797979;
 +
background: url#fff (field.png);
 +
border: 1px solid #d4d4d4;
 +
font-size: 1em;
 +
font-family: Arial, Helvetica, sans-serif;
 +
padding: 3px 4px;
 +
width: 320px;
 +
height: 27px;
 +
line-height: 27px;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
border-radius: 3px;
 +
}
 +
 
 +
.form-radio-container {
 +
font-size:.9em;
 +
min-height:20px;
 +
padding:0;
 +
margin:0 0 5px 0 !important;
 +
}
 +
 
 +
/* Footer Form Customization
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.wsite-form-container {
 +
margin-top:0px !important;
 +
text-align:left;
 +
}
 +
 
 +
.wsite-footer .wsite-form-label {
 +
font-size: 1em;
 +
padding: 5px 0 2px 0;
 +
}
 +
 
 +
.wsite-footer .wsite-form-field {
 +
width:350px !important;
 +
}
 +
 
 +
 
 +
.wsite-footer .wsite-form-input {
 +
font-size: 1em;
 +
width: 100% !important;
 +
}
 +
 
 +
.wsite-footer .form-select {
 +
width: 100%;
 +
}
 +
/* Buttons
 +
--------------------------------------------------------------------------------*/
 +
 
 +
/* Small structure & regular style */
 +
 
 +
.wsite-button {
 +
background: #333;
 +
color: white !important;
 +
font-size: 13px;
 +
font-weight: 700;
 +
padding: 0 10px 0 0;
 +
text-align: center;
 +
text-decoration: none !important;
 +
}
 +
 
 +
.wsite-button:hover {
 +
background-position:0 0;
 +
background:#000;
 +
}
 +
 
 +
.wsite-button:active {
 +
background-position:0 0;
 +
}
 +
 
 +
.wsite-button-inner {
 +
color: #fff !important;
 +
padding:3px 15px 3px 15px;
 +
background: #222;
 +
}
 +
 
 +
.wsite-button:hover .wsite-button-inner {
 +
}
 +
 
 +
.wsite-button:active {}
 +
 
 +
/* Large structure & regular style  */
 +
 
 +
.wsite-button-large {
 +
font-size:14px;
 +
background: #333;
 +
}
 +
.wsite-button-large:hover {
 +
font-size:14px;
 +
background:#000;
 +
}
 +
 
 +
.wsite-button-large .wsite-button-inner {
 +
font-size:14px;
 +
padding:8px 15px 8px 15px;
 +
background: #222;
 +
}
 +
 
 +
/* Highlighted styles */
 +
 
 +
.wsite-button-highlight, .wsite-button-large.wsite-button-highlight {
 +
background: #931C18;
 +
}
 +
 
 +
.wsite-button-highlight:hover , .wsite-button-large.wsite-button-highlight:hover {
 +
background: #61120F;
 +
}
 +
 
 +
.wsite-button-highlight .wsite-button-inner {
 +
background-image: none;
 +
background: #7F1714;
 +
}
 +
 
 +
.wsite-button-large.wsite-button-highlight .wsite-button-inner {
 +
background-image: none;
 +
background: #7F1714;
 +
}
 +
.paragraph {
 +
font-family: Arial;
 +
font-size: 15px;
 +
font-style: normal;
 +
font-variant: normal;
 +
font-weight: 400;
 +
line-height: 22px;
 +
color: #545e5f;
 +
}
  
−
      #footer {
 
−
      height: 500px;}
 
  
−
｝
 
 
</style>
 
</style>
 
</html>
 
</html>
 +
{{:Team:CityU_HK/background}}

Latest revision as of 08:17, 18 July 2015