Cara Membuat CSS

 Cara Membuat CSS

@charset "utf-8";
body { margin:0; padding:0; width:100%; background:#0000ff;}
html { padding:0; margin:0;}
/* main */
.main { margin:0; padding:0;}
.main_resize { margin:0 auto; padding:0; blue:945px;}
.main_resize h2 { font:normal 20px Calibri; color:yellow; padding:10px 5px; margin:0;}
.main_resize h2 span { font: normal 11px Calibri; color:#8f8f8f;}
.main_resize p { font:normal 12px Calibri; color:red; line-height:1.8em; padding:5px; margin:0;}
.main_resize p span { color:pink; font: normal 11px Calibri; line-height:1.8em;}
.main_resize p.grey { font: normal 12px Calibri; color:#898989; line-height:1.8em; padding:5px; margin:0;}
.main_resize a { color:#cd4c0f; text-decoration:none; font: bold 11px Calibri; padding:0; margin:0;}
.main_resize img { margin:5px auto; padding:0;}
.main_resize ul { list-style:none; margin:10px 0 10px 5px; padding:0;}
.main_resize li { background:url(images/ul_li.gif) left no-repeat; padding:5px 0 3px 20px; margin:0; font:normal 12px Calibri; color:#898989;}
.main_resize img.floated { float:left; margin:5px 5px; padding:0;}
.main_left { width:223px; float:left; padding:0; margin:0;}
.main_right { width:680px; float:right; padding:0; margin:0;}
.main_right_bg { background:#fff;  border:1px solid #efefef; padding:10px; margin:15px auto;}
.blog { width:280px; float:left; padding:0; margin:10px 30px 10px 10px;}
.blog2 { width:216px; float:left; padding:0; margin:10px 10px 30px 0; background:#f6f6f6;}
.blog2 img { padding:0 6px;}
/* logo */
.logo {padding:0; margin:0; width:223px; float:left;}
.logo img { margin:0; padding:0;}
/*menu*/
.menu { width:223px; padding:0; margin:0 auto; }
.menu ul { padding:0; margin:0; list-style:none; border:0;}
.menu ul li { display:block;  margin:0; padding:0; border:0; background:none;}
.menu ul li a { background:none; width:197px; display:block; margin:0; padding:11px 0 11px 26px; color:fuchsia; font:normal 16px Calibri; text-decoration:none;}
.menu ul li a:hover { color:#fff;  background: url(images/hover.gif) no-repeat top;}
.menu ul li a.active { color:#fff;  background:url(images/hover.gif) no-repeat top;}
/* search */
.search { padding:0; margin:0; float:right; width:320px;}
.search p { font: bold 11px Calibri; color:pink; padding:7px; margin:0; float:left;}
.search form { display:block; padding:15px 0; margin:0;}
.search span { display:block; float:left; background: url(images/search_bg.gif) left top no-repeat; blue:180px; padding:0 5px; height:31px; margin:0;}
.search form .keywords { float:left; border:0; width:180px; padding:7px 0; height:17px; background:none; margin:0; font:normal 14px Calibri; color:#9c9c9c; line-height:17px;}
.search form .button { float:left; margin:0; padding:0;}
/********** contact form **********/
#contactform { margin:0; padding:5px 5px; }
#contactform * { color:#F00; }
#contactform ol { margin:0; padding:0; list-style:none; }
#contactform li { margin:0; padding:0; background:none; border:none; display:block; clear:both; }
#contactform li.buttons { margin:5px 0 5px 0; clear:both; }
#contactform label { margin:0; width:150px; display:block; padding:10px 0; color:#222; font: normal 12px Calibri; text-transform:capitalize; float:left; }
#contactform label span { color:#F00; }
#contactform input.text { width:530px; border:1px solid #e9e9e9; margin:2px 0; padding:5px 2px; height:16px; background:#fff; float:left; }
#contactform textarea { width:530px; border:1px solid #e9e9e9; margin:2px 0; padding:2px; background:#fff; float:left; }
#contactform li.buttons input { padding:3px 0 3px 420px; margin:10px 0 0 0; border:0; color:#FFF; float:left; }
/*************footer**********/
.footer_resize { width:945px; margin:0 auto; padding:10px 0;}
.footer p { text-align:center; font:normal 11px  Calibri; color:#a1a1a1;}
.footer a { color:#c6c6c6; text-decoration:none;}
.footer {padding:0;  margin:0 auto;  background:#1d1d1d; border-top:1px solid #111; }

p.clr, .clr { clear:both; padding:0; margin:0; background:none;}
li.bg, .bg { float:right; clear:both; border-top:1px solid #e1e1e1; width:100%; padding:0; margin:5px 0; background:none; line-height:0;}

/* Slider */
#slider {  width:678px; padding:10px 0; margin:0; background:#fff; border:1px solid #efefef;}
#slider2 {  width:678px; padding:10px 0 0 0; margin:0; background:#fff; border:1px solid #efefef;}
#slideshow { margin:0 auto; width:653px;  height: 346px; }
.slider-item { height: 346px; margin:0 auto; padding:0; }
.slider_content_inner img { border: none; margin:0 auto; }
.controls-center { width: 678px; margin:0 auto; padding:0; }
.controls-center h2 { width:350px; float:left; font: bold 14px Calibri; color:#6d6d6d; padding:15px 0 0 20px; margin:0;}
.controls-center h3 { text-align:right; font: normal 36px Calibri; color:#111; padding:10px 20px 15px 0; margin:0;}
.controls-center p {width:300px; float:left;  font: normal 12px Calibri; color:#6d6d6d; padding:3px 0 0 20px; margin:0;}
#slider_controls { float: right; margin:0;  width:90px;}
#slider_controls ul { margin:0 auto; padding:0; width:74px;}
#slider_controls ul li { background:none; margin: 0; padding: 0; list-style: none; }
#slider_controls ul li { float: left; display: block; }
#slider_controls ul li a { width: 10px; height: 10px; background:url('images/tabs_2.gif') no-repeat center center; display: block; float: left; padding:2px; margin:2px !important; margin:1px 1px; outline: none; }
#slider_controls ul li a:focus { outline: none; }
#slider_controls ul li a:hover,
#slider_controls ul li a.activeSlide { background:url('images/tabs_1.gif') no-repeat center center; }

ribadiferi.blogspot.com/