c. CSS
a. CSS USER INTERFACE
{margin:0;padding:0; font-family:Arial, Helvetica, sans-serif;} a {text-decoration:none; outline:none;}
a img {border:none;} html {height:100}
body {text-align:center; background-color:878787; background-position:top; height:100;} wrapper {text-align:left; width: 970px; background:urlimageslayout.jpg; background-position:center; min-
height: 100; height: auto important; height: 100; margin: 0 auto -160px;} header { padding:0 20px 0 20px; position:relative; height:120px;}
title {float:left;} title a:hover img {opacity: .5;}
topNav { float:right; width:400px; height:70px; background:000; position:relative; Rounded Corners
-moz-border-radius: 0 0 20px 20px; -webkit-border-radius: 0 0 20px 20px;
border-radius: 0 0 20px 20px;} topNav signin {float:left;}
topNav signin:hover { opacity: .5;} topNav signout { float:left;}
topNav signout:hover { opacity: .5;} topNav signup { float:left;}
topNav signup:hover { opacity: .5;} topNav orderconf { position:absolute; bottom:7px; left:7px;}
topNav orderconf:hover { opacity: .5;} topNav cart {float:right; margin:10px; color:000; font-family:Arial, Helvetica, sans-serif; font-
weight:bold;} topNav cart:hover { opacity: .5;}
topNav cartSum {position:absolute; right:75px; top:17px; }
Universitas Sumatera Utara
topNav profile { font-weight:bold; font-style:italic; color:FFF; position:absolute; left:130px; top:12px;}
topNav profile:hover { opacity: .5;} facebook {right:35px;
bottom:5px; position:absolute;}
facebook a:hover {opacity: .5;} headerSlide {margin:5px 20px 5px 20px; clear:both; height:150px; background-color:333;}
mainNav {margin:5px 20px 0px 20px; height:27px; background-color:FFF; clear:both;} mainNav ul {list-style:none;}
mainNav li a {padding:0px 10px 0px 10px; float:left; background-color:FFF;} mainNav li a off { display:none;}
mainNav li a on { display:block;} mainNav li.show {padding:0px 10px 0px 10px; float:left; background-color:000; cursor:default;
height:27px; border-top:06F solid 3px;} mainNav li a.show {background-color:000; cursor:default; border-top:06F solid 3px;}
mainNav li a:hover, mainNav ul li:hover a, mainNav li ul.show a, mainNav li a.show {background- color:000;}
mainNav ul li:hover a on { display:none;} mainNav ul li:hover a off { display:block;}
mainNav li a:hover on { display:none;} mainNav li a:hover off { display:block;}
mainNav li ul { margin:27px 0px 0px 0px; position:absolute; z-index:200;} mainNav li ul.hide {display:none;}
mainNav li ul.show {display:block;} mainNav li:hover ul{display:block;}
mainNav li li {float:left;} mainNav li ul a {padding:5px 35px 5px 35px;}
mainNav li ul a:hover img{opacity: .5;} subNav { margin:0px 20px 5px 20px; height:26px; background-color:000;}
Universitas Sumatera Utara
.tbox {position:absolute; display:none; padding:14px 17px; z-index:900} .tinner {padding:15px; -moz-border-radius:5px; border-radius:5px; background:fff urlimagespreload.gif no-
repeat 50 50; border-right:1px solid 333; border-bottom:1px solid 333} .tmask {position:absolute; display:none; top:0px; left:0px; height:100; width:100; background:000; z-
index:800} .tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer;
background:urlimagesclose.png no-repeat} .tclose:hover {background-position:0 -30px}
error {background:ff6969; color:fff; text-shadow:1px 1px cf5454; border-right:1px solid 000; border- bottom:1px solid 000; padding:0}
error .tcontent {padding:10px 14px 11px; border:1px solid ffb8b8; -moz-border-radius:5px; border- radius:5px}
success {background:2ea125; color:fff; text-shadow:1px 1px 1b6116; border-right:1px solid 000; border- bottom:1px solid 000; padding:10; -moz-border-radius:0; border-radius:0}
bluemask {background:4195aa} frameless {padding:0}
frameless .tclose {left:6px}
content {margin:5px 20px 5px 20px;} contentTitle {padding:5px; margin:0 0 5px 0; background-color:BBB; font-weight:bold; color:09F;
text-transform:uppercase;}
invoice { margin:5px; padding:5px; background:CCC; text-align:center;} invoice p { margin:0 0 10px 0;}
.headInvoice { color:03F; font-weight:bold;}
menuContent {padding:5px; background-color:999;}
newsNav {float:left; text-transform:uppercase; font-family:Arial, Helvetica, sans-serif; font- weight:bold; width:150px; }
Universitas Sumatera Utara
newsNav ul {list-style:none;} newsNav li a {display:block; padding:5px; text-decoration:none; color:AAA ; background-
color:000; }
newsNav li.show {display:block; padding:5px; text-decoration:none; color:000; background-color:FFF;
} newsNav a:hover {color:FFF; background-color:333}
newsTitle {padding:5px; float:right; width:750px; background-color:777; text-transform:uppercase; font-weight:bold; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color: FC0;}
newsInfo {padding:5px; float:right; width:750px; background-color:888; text-transform:capitalize; font-weight:bold;}
newsContent {padding:0 5px 5px 5px; float:right; width:750px; background-color:999; text- align:justify;}
newsContent img {margin:5px 0 0 0;} newsContent p {margin:5px 0 0 0;}
newsTag {padding:5px; margin:0 0 5px 0; float:right; width:750px; background-color:AAA; border- top-width: 1px; border-top-style:solid; border-top-color:000;
text-transform:capitalize;} newsComment {padding:5px; margin:0 0 5px 0; float:right; width:750px; background-color:777;}
newsComment p {text-align:justify; padding:5px;}
newsPost {padding:5px 5px 0 5px; float:right; width:750px; background-color:888;} newsPost form {padding:5px;}
newsPost p {margin:0 0 5px 0;} newsPage {padding:5px; float:right; width:750px; background-color:999;}
newsPage.detail {margin:0 0 5px;} newsPage a.pref {float:left;}
newsPage a.next {float:right;}
product { margin:5px; background:999; width:180px; height:230px; float:left; text-align:center; position:relative;}
product a img { text-decoration:none; border:none;} product a:hover { color:FF0;}
Universitas Sumatera Utara
productInfo { padding:5px; background:666; height:40px; width:170px; bottom:0px; position:absolute;}
productPage {padding:5px; background-color:999; clear:both;}
productImage { margin:5px 5px 10px 5px; width:400px; height:400px; background-color:999; float:left;}
productTitle { margin:5px 5px 0 5px; padding:5px; width:400px; float:left; background-color:999; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:FC0;}
productPrice {margin:0 5px 0 5px; padding:5px; width:400px; float:left; background-color:999; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:FC0;}
productDescription {margin:0 5px 0 5px; padding:5px; width:400px; float:left; background- color:999; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:FC0;}
productSize {margin:0 5px 0 5px; padding:5px; width:400px; float:left; background-color:999; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:FC0;}
productSize ul {list-style:none;} productSize li a {display:block; text-align:center; padding:5px; margin:5px; text-
decoration:none; color:FFF; background-color:06F; float:left; height:20px; width:20px;} productSize li.click {display:block; text-align:center; padding:5px; margin:5px; text-
decoration:none; float:left; height:20px; width:50px; background:0CF; color:333; cursor:default;} productSize li a:hover { background:0CF; color:333;}
productQty {margin:0 5px 0 5px; padding:5px; width:400px; float:left; background-color:999; border-bottom-width:1px; border-bottom-style:solid; border-bottom-color:FC0;}
productSuggests {margin:5px; background-color:999; } psTitle {padding:5px; background-color:777; text-transform:uppercase; font-weight:bold;
border-bottom-width:1px; border-bottom-style:solid; border-bottom-color: FC0;} pd { margin:5px; background:999; width:180px; height:210px; float:left; text-align:center;
position:relative;} pd a img { text-decoration:none; border:none;}
pd a:hover { color:FF0;} pdInfo { padding:5px; background:666; height:20px; width:170px; bottom:0px;
position:absolute;} shoppingCart { background:888;}
shoppingCart td.header { padding:5px; text-align:center; font-weight:bold; background:FFF; }
Universitas Sumatera Utara
shoppingCart td.content { line-height:50px; padding:5px; border-bottom:F90 solid 1px;} discountCode { padding:10px; background-color:888; margin:5px 0 0 0;}
discountCode td { background-color:FFF; padding:5px;} shipping { padding:10px 10px 5px 10px; background-color:888; margin:5px 0 0 0;}
shipping td { background-color:777; padding:5px;} shipping p { padding:0 0 5px 0;}
total { padding:10px; background-color:888; margin:5px 0 0 0;} total td { background-color:777; padding:5px; border-top:F90 solid 1px;}
button { padding:10px; background-color:888; margin:5px 0 0 0;} button td { background-color:777; padding:5px;}
billingInfo, shippingInfo, confirmOrder { background:999; padding:5px; position:relative; margin:0 0 5px 0;}
billingInfo p, shippingInfo p, confirmOrder p { padding:5px;} loginBox { background:CCC; height:170px; width:300px; position:absolute; top:20px;
right:20px; padding:5px; text-align:center;}
.disable { visibility:hidden}
clear {clear:both; height:0px;}
push {height:160px; background-image:urlimagesfoot.jpg; margin:0 20px 0 20px;} footer { text-align:left; width: 970px; height:160px; margin:0 auto;}
link { margin:0 20px 5px 20px; background-images:urlimagesfooter.jpg; height:50px;} bottomNav { margin:5px 20px 5px 20px; background-image:urlimagesfoot.jpg; background-
position:center; height:70px;} footNote { margin:0 20px 0 20px; text-align:center; line-height:30px; display:block; background-
color:000;}
Universitas Sumatera Utara
b. CSS ADMIN INTERFACE