Difference between revisions of "Team:SPSingapore/CSS/menu"
Line 146: | Line 146: | ||
} | } | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
.tablelist{ | .tablelist{ | ||
Line 159: | Line 153: | ||
margin-top:0%; | margin-top:0%; | ||
font-size:15px; | font-size:15px; | ||
+ | } | ||
+ | |||
+ | /* Footer */ | ||
+ | |||
+ | #footer { | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | padding: 4px 0 20px; | ||
+ | background:white; | ||
+ | border-top:5px solid blue; | ||
+ | } | ||
+ | #footer .left_sec { | ||
+ | float: left; | ||
+ | width: 500px; | ||
+ | padding: 0 0 0 10px; | ||
+ | } | ||
+ | #footer .right_sec { | ||
+ | float: right; | ||
+ | width: 350px; | ||
+ | padding: 0 23px 0 0; | ||
+ | } | ||
+ | #footer .right_sec p { | ||
+ | text-align: right!important; | ||
+ | } | ||
+ | #footer .right_sec ul { | ||
+ | float: right; | ||
+ | width: auto; | ||
+ | } | ||
+ | #footer p { | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | color: #111434; | ||
+ | font-size: 12px!important; | ||
+ | font-size: .76em; | ||
+ | line-height: 1.3em; | ||
+ | font-family: Arial, Helvetica, sans-serif; | ||
+ | } | ||
+ | #footer ul { | ||
+ | margin-top: -10px; | ||
+ | float: left; | ||
+ | width: 100%; | ||
+ | list-style: none; | ||
+ | padding: 2px 60px 0; | ||
+ | } | ||
+ | #footer ul li { | ||
+ | float: left; | ||
+ | width: auto; | ||
+ | padding: 0 23px 0 4px; | ||
+ | background: url(../images/footer_navi_sep.gif) no-repeat right 3px; | ||
+ | } | ||
+ | #footer ul li.last { | ||
+ | background: 0 0; | ||
+ | padding-right: 0; | ||
+ | } | ||
+ | #footer ul li a { | ||
+ | float: left; | ||
+ | width: auto; | ||
+ | color: #111434; | ||
+ | text-decoration: none; | ||
+ | font-size: 12px!important; | ||
+ | font-size: .76em; | ||
+ | line-height: 1.3em; | ||
+ | font-family: Arial, Helvetica, sans-serif; | ||
+ | } | ||
+ | #footer ul li a:hover { | ||
+ | text-decoration: underline; | ||
+ | } | ||
+ | #print-section { | ||
+ | display: none; | ||
} | } |
Revision as of 10:43, 12 September 2015
/*TOP LOGO*/
.logo { width: 100%; background-color: black; background-size: 100%; background-position: center; background-repeat: no-repeat; height: 140px; border-bottom: 2px solid red; }
/* Remove Title Heading */
.firstHeading { display:none; }
/*CSS MENU*/
- cssmenu {
background: MidnightBlue ; width: auto; font: 0.4em/1.3 Verdana, Arial, Helvetica, Sans-serif;
}
- cssmenu ul {
list-style: none; margin: 0; padding: 0; line-height: 1; display: block; zoom: 1;
}
- cssmenu ul:after {
content: " "; display: block; font-size: 0; height: 0; clear: both; visibility: hidden;
}
- cssmenu ul li {
display: inline-block; padding: 0; margin: 0;
}
- cssmenu.align-right ul li {
float: right;
}
- cssmenu.align-center ul {
text-align: center;
}
- cssmenu ul li a {
color: #ffffff; text-decoration: none; display: block; padding: 15px 25px; font-family: 'Open Sans', sans-serif; font-weight: 700; text-transform: uppercase; font-size: 14px; position: relative; -webkit-transition: color .25s; -moz-transition: color .25s; -ms-transition: color .25s; -o-transition: color .25s; transition: color .25s;
}
- cssmenu ul li a:hover {
color: red;
}
- cssmenu ul li a:hover:before {
width: 100%;
}
- cssmenu ul li a:after {
content: ""; display: block; position: absolute; right: -3px; top: 19px; height: 6px; width: 6px; background: #ffffff; opacity: .5;
}
- cssmenu ul li a:before {
content: ""; display: block; position: absolute; left: 0; bottom: 0; height: 3px; width: 0; background: red; -webkit-transition: width .25s; -moz-transition: width .25s; -ms-transition: width .25s; -o-transition: width .25s; transition: width .25s;
}
- cssmenu ul li.last > a:after,
- cssmenu ul li:last-child > a:after {
display: none;
}
- cssmenu ul li.active a {
color: red;
}
- cssmenu ul li.active a:before {
width: 100%;
}
- cssmenu.align-right li.last > a:after,
- cssmenu.align-right li:last-child > a:after {
display: block;
}
- cssmenu.align-right li:first-child a:after {
display: none;
} @media screen and (max-width: 768px) {
#cssmenu ul li { float: none; display: block; } #cssmenu ul li a { width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom: 1px solid #fb998c; } #cssmenu ul li.last > a, #cssmenu ul li:last-child > a { border: 0; } #cssmenu ul li a:after { display: none; } #cssmenu ul li a:before { display: none; }
}
body { margin: 0px 0; padding: 0; text-align: center; font: 0.8em/1.3 Verdana, Arial, Helvetica, Sans-serif; background-color: black !important; }
.tablelist{
margin-left: 10%;
margin-right:10%;
border-collapse: collapse;
margin-top:0%;
font-size:15px;
}
/* Footer */
- footer {
float: left;
width: 100%; padding: 4px 0 20px;
background:white; border-top:5px solid blue; }
- footer .left_sec {
float: left; width: 500px; padding: 0 0 0 10px;
}
- footer .right_sec {
float: right; width: 350px; padding: 0 23px 0 0;
}
- footer .right_sec p {
text-align: right!important;
}
- footer .right_sec ul {
float: right; width: auto;
}
- footer p {
float: left; width: 100%; color: #111434; font-size: 12px!important; font-size: .76em; line-height: 1.3em; font-family: Arial, Helvetica, sans-serif;
}
- footer ul {
margin-top: -10px;
float: left; width: 100%; list-style: none; padding: 2px 60px 0;
}
- footer ul li {
float: left; width: auto; padding: 0 23px 0 4px; background: url(../images/footer_navi_sep.gif) no-repeat right 3px;
}
- footer ul li.last {
background: 0 0; padding-right: 0;
}
- footer ul li a {
float: left; width: auto; color: #111434; text-decoration: none; font-size: 12px!important; font-size: .76em; line-height: 1.3em; font-family: Arial, Helvetica, sans-serif;
}
- footer ul li a:hover {
text-decoration: underline;
}
- print-section {
display: none;
}