* {
    padding: 0;
    margin: 0;
}

body {
    text-align: center;
    font-size: 12px;
    font-family: Verdana, Tahoma;
    line-height: 150%;
    background: #EBFAFF url("/images/bg.gif") repeat-y center;
}

#body {
    position: relative;
    margin: 5px auto 10px auto;
    width: 784px;
}

#site {
    text-align: left;
    margin: 0 auto 0 auto;
    width: 784px;
}

h1 {
    font-size: 24px;
    font-weight: bold;
    font-family: "Trebuchet MS", Verdana, Tahoma;
    margin-bottom: 15px;
    color: #a30;
}

h2 {
    padding-bottom: 2px;
    margin-bottom: 4px;
    font-size: 13px;
    font-weight: bold;
    font-family: Verdana, "Trebuchet MS", Tahoma;
    color: #1E759D;
}

h3 {
    padding-bottom: 2px;
    margin-bottom: 8px;
    font-size: 14px;
    font-family: "Trebuchet MS", Verdana, Tahoma;
}

h4 {
    padding-bottom: 2px;
    margin-bottom: 2px;
    font-size: 13px;
    font-family: "Trebuchet MS", Verdana, Tahoma;
    color: #333;
}

img {
    border: 0;
}

a {
    color: #1F6383;
}

a:hover {
    color: #B54314;
}

a.logo {
    color: #000;
    text-decoration: none;
}

a.logo:hover {
    color: #000;
    text-decoration: none;
    background-color: #fff;
}

a.black {
    color: #000;
    text-decoration: none;
}

a.black:hover {
    color: white;
    text-decoration: none;
    background-color: #000;
}

a.red {
    color: #900;
    text-decoration: none;
}

a.red:hover {
    color: white;
    text-decoration: none;
    background-color: #900;
}

a.white {
    color: #fff;
    text-decoration: underline;
}

a.white:hover {
    color: #000;
    text-decoration: underline;
    background-color: #fff;
}

a.gray {
    color: #666;
    text-decoration: underline;
}

a.gray:hover {
    color: #fff;
    text-decoration: underline;
    background-color: #666;
}

a.blue {
    color: #0066cc;
    text-decoration: underline;
}

a.blue:hover {
    color: #fff;
    text-decoration: underline;
    background-color: #0066cc;
}

input, textarea, select {
    font-size: 12px;
    font-family: Verdana, Tahoma, "Trebuchet MS";
    padding: 3px 3px 3px 3px;
}

.heading {
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
    width: 100%;
}

.info {
    margin-bottom: 5px;
    margin-left: 5px;
    border: 0px solid #ddd;
    background-color: #eee;
}

.difficulty {
    float: right;
    font-weight: normal;
    font-size: 11px;
    color: #999;
}

.hr {
    font-size: 32px;
    line-height: 1px;
    height: 0;
    border-bottom: 1px solid #ccc;
}

.clear {
    padding: 0;
    font-size: 1px;
    line-height: 1px;
    height: 0;
    clear: both;
}

td.label {
    text-align: right;
    padding: 3px 10px 3px 0;
    white-space: nowrap;
}

td.field {
    padding: 3px 10px 3px 0;
    width: 100%;
}

/*** Header ***/

#header {
    position: relative;
    margin: 0 auto;
    padding: 0 20px 5px 20px;
    background: url("/images/bgfooter.gif") no-repeat bottom;
}

#header #log_in {
    position: absolute;
    top: 40px;
    right: 20px;
    padding: 2px 4px;
    background: #EBFAFF;
}

#header ul {
    background: url("/images/bgfooter.gif") no-repeat top;
    list-style: none;
    padding: 5px 0 5px 30px;
    margin-top: 10px;

}

#header li {
    float: left;
    padding: 0px;
    margin-right: 12px;
    font-size: 12px;
}

#header li.home {
    background: url("/images/icon_home.gif") no-repeat;
    padding-left: 20px;
}

#header li.myresipi {
    background: url("/images/icon_user.gif") no-repeat;
    padding-left: 20px;
}

#header li.senarai {
    background: url("/images/page_text.gif") no-repeat;
    padding-left: 20px;
}

#header li.shop {
    background: url("/images/shop.gif") no-repeat;
    padding-left: 20px;
}

#header li.forum {
    background: url("/images/forum.gif") no-repeat;
    padding-left: 20px;
}

#header li.blog {
    background: url("/images/blog.gif") no-repeat;
    padding-left: 20px;
}

#header li.cari {
    background: url("/images/page_find.gif") no-repeat;
    padding-left: 20px;
}

#header li.glossary {
    background: url("/images/glossary.gif") no-repeat;
    padding-left: 20px;
}

#header li.about {
    background: url("/images/icon_info.gif") no-repeat;
    padding-left: 20px;
    margin-right;
}

#header li.message {
    background: url("/images/icon_email.gif") no-repeat;
    padding-left: 20px;
    margin-right: 0;
}

/*** Welcome ***/

#welcome {
    margin-top: 20px;
    background: url("/images/bgfooter.gif") no-repeat top;
    font-size: 11px;
    color: #666;
    text-align: center;
    line-height: 140%;
    padding: 12px 10px 0px 10px;
}

#what {
    float: left;
    text-align: left;
    width: 380px;
}

#ad {
    text-align: left;
    width: 320px;
    border: 0px solid #ddd;
    float: right;
    padding: 0px;
}

/*** Center Column ***/

#center_column {
    padding: 0 20px;
    width: 704px;
    margin-top: 25px;
}

#center_column ol {
    padding: 5px;
}

/*** Left Column ***/

#left_column {
    float: left;
    padding-left: 20px;
    width: 374px;
    margin-top: 25px;
}

#left_column img {
    float: left;
    padding-right: 0px;
}

#left_column .laporan {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 330px;
    margin-bottom: 5px;
    margin-right: 5px;
}

#left_column .semualaporan {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 362px;
    margin-bottom: 5px;
    margin-right: 5px;
}

#laporanuser {
    padding-left: 20px;
    width: 750px;
    margin-top: 25px;
}

.laporangambartengah {
    text-align: center;
    padding-top: 3px;
}

.list ul {
    padding: 0px;
}

#laporanuser .wrap {
    float: left;
    width: 130px;
    margin-right: 13px;
    height: 300px;

}

#laporanuser .laporan {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 120px;
    margin-bottom: 5px;
    height: 280px;
}

#senarai {
    padding-left: 20px;
    width: 750px;
    margin-top: 25px;
}

#senarai .wrap {
    float: left;
    width: 230px;
    margin: 0 10px 10px 0;
    height: 95px;

}

#senarai .laporan {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 220px;
    margin-bottom: 5px;
    height: 85px;
}

#senarai .gambarresipi {
    float: left;
}

#glossary {
    padding-left: 20px;
    width: 750px;
    margin-top: 25px;
}

#glossary .wrap {
    float: left;
    width: 110px;
    margin: 0 10px 40px 0;
    height: 110px;

}

#glossary .list {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 100px;
    margin-bottom: 10px;
    height: 140px;
}

#glossary .gambar {
    text-align: center;
}

.bahan {
    padding-top: 20px;
}

.bahan li {
    padding: 5px;
    border-top: 1px solid #dddddd;
    list-style: none;
}

.tag {
    padding-top: 20px;
}

.cara {
    padding-top: 20px;
}

.gambarcara {
    float: right;
    padding: 8px 0 0 5px;
}

.cara li {
    padding: 5px;
}

.cara ol {
    padding-left: 20px;
}

.komen {
    padding-top: 10px;
}

.komen li {
    padding: 5px;
}

.komen ol {
    padding-left: 20px;
}

#menu {
    border-bottom: 3px solid #cbeaf7;
    margin: 0;
    padding-bottom: 21px;
    padding-left: 10px;

}

#menu ul, #menu li {
    display: inline;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#menu a:link, #menu a:visited {
    background: #fff;
    border: 3px solid #cbeaf7;
    color: #666;
    float: left;
    font-size: small;
    font-weight: normal;
    line-height: 14px;
    margin-right: 8px;
    padding: 2px 11px 2px 10px;
    text-decoration: none;
}

.recipe #menu li#nav-1 a,
.report #menu li#nav-2 a,
.glosarry #menu li#nav-3 a {
    background: #EBFAFF;
    border-bottom: 3px solid #EBFAFF;
    color: #000;
}

#menu a:hover {
    color: white;
    text-decoration: none;
    background-color: #CC4E35;
}

/*** User Menu ***/
#user_menu {
    margin-top: 0px;
    padding: 10px 10px 10px 10px;
    border-top: 0 solid #cbeaf7;
    border-bottom: 3px solid #cbeaf7;
    border-left: 3px solid #cbeaf7;
    border-right: 3px solid #cbeaf7;
    background: #ebfaff;
}

#user_menu li {
    padding: 5px;
    list-style: none;

}

#help {
    margin-top: 5px;
    padding: 10px 10px 10px 10px;
    border: 3px solid #ddd;
    background: #eee;
    width: 300px;
}

#help  dt, dd {
    padding: 5px;
    clear: both;
}

/*** Right Column ***/

#right_column {
    position: relative;
    float: left;
    margin-left: 27px;
    width: 340px;
    margin-top: 25px;
}

#right_column img {
    float: left;
}

.all {
    float: left;
    margin-right: 10px;
}

#right_column .laporan {
    border: 1px solid #ddd;
    background: #fff;
    padding: 5px;
    font-size: 11px;
    width: 330px;
    margin-bottom: 5px;
    margin-right: 5px;
}

#right_column .laporan img {
    padding-right: 10px;
}

.section {
    padding: 10px 10px 10px 10px;
    border-bottom: 0px dashed #666;
    font-size: 11px;
}

.section img {
    padding-right: 10px;
}

.kategori {
    padding-right: 10px;
    text-align: center;
    font-size: 11px;
    color: #333;
}

.kategori a {
    color: #666;
}

.kategori a:hover {
    color: #fff;
    background: #666;
}

.tablekategori {
    padding-top: 7px;
}

.info {
    border-top: 1px solid #ccc;
    padding-top: 5px;

}

#help img {
    padding-right: 4px;
    margin: 0;
}

#user_menu img {
    padding-right: 4px;
    margin: 0;
}

#uploadgambar {
    margin-top: 5px;
    padding: 10px 10px 10px 10px;
    border: 3px solid #ddd;
    background: #eee;
}

.small {
    font-size: 11px;
}

/*** Footer ***/

#footer {
    padding: 8px 15px;
    margin-top: 20px;
    text-align: center;
    font-size: 11px;
    background: url("/images/bgfooter.gif") no-repeat top;
    color: #793A00;
    clear: both;
}

#footer a:link,
#footer a:visited {
    color: #793A00;
}

#footer a:hover {
    background: #793A00;
    color: #fff;
}

/*** Error ***/

#error {
    padding: 0;
    margin-bottom: 20px;
    text-align: left;
    background-color: #fdd;
    border: 1px solid #ccc;
    clear: both;
}

#error h3 {
    padding: 4px 10px;
    margin: 0;
    text-align: left;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    background: #c00;
}

#error p {
    color: #333;
    margin: 0;
    padding: 5px;
}

#error ul {
    margin: 0;
    padding: 10px 0 10px 30px;
}

#error li {
    padding: 4px 15px 4px 0;
    font-size: 12px;
    list-style: square;
}

/*** Search Column ***/

#search_column {
    padding: 0 20px;
    width: 704px;
    margin-top: 25px;
}

#search_column ol {
    padding: 5px;
}

#search_column img {
    float: left;
}

#aksesori {
    float: left;
    padding-right: 5px;
}

#halalgelatin {
    padding: 5px;
    border: 3px solid #ddd;
    font-size: 11px;
    background: #eee;
    text-align: center;
}

#gathering {
    padding: 5px;
    border: 3px solid #ddd;
    font-size: 11px;
    background: url("/images/bannergathering.jpg") 0 0;
    text-align: center;
}

.smalltext {
    font-size: 10px;
}

.smallright {
    font-size: 11px;
    text-align: right;
}

.logincomment {
    font-size: 11px;
    color: #336633;
}

.balas_komen {
    padding: 0px 0 0px 5px;
    background: #eee;
    color: #666;
    margin-top: 5px;
}

.utilityrecipe {
    font-size: 11px;
    color: #666;
}

.utilityrecipe a {
    color: #666;
}

.utilityrecipe a:hover {
    color: #fff;
    background: #666;
}

.utilitykomen {
    font-size: 11px;
    color: #333;
}

.komendetails {
    font-size: 11px;
    color: #333;
}

/*** Search User (admin page) ***/

#search_user {
    padding: 0 0px;
    width: 350px;
    margin-top: 5px;
    margin-left: 0px;
}

#search_user ol {
    padding: 5px;
}

#search_user img {
    float: left;
}

/*** text ***/
.texth3 {
    font-weight: normal;
}

.jumlah {
    font-size: 10px;
    color: #333;
}

/*** member page ***/

.styletable {
    text-align: left;
    border: 1px solid #b6cee2;
    font-size: 11px;
}

.styletable tr td, .styletable tr th {
    padding: 4px 8px 4px 8px;
}

.styletable tbody tr td {
    border-bottom: 1px solid #e5ebf1;
}

.styletable tbody tr td table tr td {
    border-bottom: none;
    padding: 2px;
}

.styletable thead tr td, .styletable tr th {
    font-weight: bold;
    border: none;
    color: #3d6695;
    background-color: #f8fcff;
    border-bottom: 1px solid #e5ebf1;

}

.styletable tfoot th, .styletable tfoot td {
    background: #f8fcff;

    color: #3d6695;

}

/*** pagination ***/

div.pagination {
    padding: 3px;
    margin: 3px;
    font-size: 11px;
    line-height: 1.75em;
}

div.pagination a {
    padding: 2px 4px 2px 4px;
    margin: 1px;
    border: 1px solid #2e82c6;
    text-decoration: none;
    color: #2973af;
}

div.pagination a:hover, div.pagination a:active {
    border: 1px solid #2e82c6;
    color: black;
    background-color: #eef;
}

.paginationtop {
    text-align: right;
    font-weight: normal;
    font-size: 11px;
    color: #999;
    padding: 0 0 5px 0;
    margin: 0;
}

#image-container {
    position: relative;
    width: 200px;
    padding-right: 10px;
    float: left;
}

#image-container-recipe {
    position: relative;
    width: 200px;
    padding-right: 10px;
}

#link {
    display: block;
    position: absolute;
    top: 0px;
    left: 0;
    margin: 0px;
    padding: 0px;
    width: 200px;
    background: #f2f2f2;
    color: #000;
    text-decoration: none;
    text-align: center;
    opacity: .5;
    filter: Alpha(Opacity = 50);
}

#link span {
    display: block;
    margin: 0;
}

#heading {
    font-size: 11px;
}

#date {
    font-size: 10px;
}

#author {
    font-size: 11px;
    font-family: Verdana, Arial, Helvetica, sans-serif;

}

.cloud1 {
    font-size: 80%;
    background-color: #ffffff;
    line-height: 100%;
}

.cloud2 {
    font-size: 100%;
    background-color: #ffffff;
    line-height: 100%;
}

.cloud3 {
    font-size: 120%;
    background-color: #ffffff;
    font-weight: bold;
    line-height: 100%;
}

.cloud4 {
    font-size: 140%;
    background-color: #eeeeee;
    line-height: 120%;
}

.cloud5 {
    font-size: 160%;
    background-color: #eeeeee;
    line-height: 120%;
}

.cloud6 {
    font-size: 180%;
    background-color: #eeeeee;
    font-weight: bold;
    line-height: 120%;
}

.cloud7 {
    font-size: 200%;
    background-color: #dddddd;
    font-weight: bold;
    line-height: 130%;
}

.cloud8 {
    font-size: 220%;
    background-color: #dddddd;
    font-weight: bold;
    line-height: 130%;
}

.cloud9 {
    font-size: 240%;
    background-color: #dddddd;
    font-weight: bold;
    line-height: 130%;
}

.cloud10 {
    font-size: 260%;
    background-color: #dddddd;
    font-weight: bold;
    line-height: 140%;
}

.advert_image {
    padding-left: 10px;
}

.advert_image_right {
    padding-left: 1px;
}

/*** product page ***/

#product_left_column {
    float: left;
    padding-left: 20px;
    width: 524px;
    margin: 25px 0 20px 0;
}

#product_right_column {
    position: relative;
    float: left;
    margin-left: 27px;
    width: 190px;
    margin-top: 25px;
}

.product_thumb {
    float: left;
    width: 100px;
    height: 230px;
    border: 1px solid #ccc;
    background-color: #eee;
    padding: 7px;
    margin-right: 12px;
    margin-bottom: 10px;
}

.product_thumb h3 {
    text-align: left;
    font-weight: normal;
    font-size: 12px;
    margin-bottom: 2px;
}

.product_utility {
    text-align: left;
    font-weight: normal;
    font-size: 10px;
}

.product_howto {
    border: 1px solid #ccc;
    background-color: #eee;
    padding: 5px;
}

.product_howto ul {
    text-align: left;
    font-weight: normal;
    font-size: 11px;
    color: #666;
    padding: 0 0 5px 0;
    margin: 0;
    list-style-type: none;
}

.product_detail_desc {
    width: 210px;
    color: #999;
    float: right;

}

.product_detail_desc2 {
    font-weight: bold;
    font-size: 12px;
    color: #000;
}

.product_detail_example {
    width: 200px;
    height: 230px;
    margin: 0 0 15px 20px;
    float: left;
    color: #1E759D;
    border: 1px solid #ccc;
    padding: 4px;
    background: #f2f2f2;
    text-align: center;
}

.product_detail_example img {
    padding-bottom: 5px;
}

#created_on {
    background: url("/images/icon_clock.gif") no-repeat 0 2px;;
    font-size: 10px;
    padding: 0 0 0 20px;
    color: #1E759D;
}

#product_komen {
    float: left;
    padding-left: 20px;
    width: 524px;
    margin-top: 25px;
}

a.product_menu {
    font-size: 12px;
    color: #1E759D;
    text-decoration: none;
}

a.product_menu:hover {
    font-size: 12px;
    color: white;
    text-decoration: none;
    background-color: #1E759D;
}

.message-hold {
    float: left;
    width: 100%;
}

.message-left-hold {
    float: left;
    width: 170px;
    margin-top: 20px;
}

.message-left-hold ul {
    list-style: none;
    width: 100%;
    float: left;
}

.message-left-hold ul li {
    float: left;
    width: 100%;
    font-size: 14px;
    color: #1F6383;
}

.message-left-hold ul li a {
    background: none repeat scroll 0 0 #F6F6F6;
    color: #1F6383;
    float: left;
    font-size: 10px;
    line-height: 20px;
    margin-top: 1px;
    padding: 0 10px;
    text-decoration: none;
    width: 87%;
}

.message-left-hold ul li a:hover {
    background: none repeat scroll 0 0 #fff;
}

.message-right-hold {
    border-left: 1px solid #CCCCCC;
    float: right;
    margin-top: 20px;
    padding-left: 20px;
    width: 593px;
}

.message-from {
    float: left;
    margin-left: 8px;
    width: 217px;
}

.message-holder {
    float: left;
    width: 340px;
}

.message-from-hold {
    float: left;
    width: 220px;
}

.message-cont-hold {
    float: left;
    width: 340px;
}

.message-from-hold img {
    float: left;
    margin-right: 5px;
    margin-top: 2px;
}

.from-main-div {
    float: left;
    color: #1F6383;
    width: 70px;
    margin-right: 20px;
}

.from-content {
    float: left;
    width: auto;
    padding: 3px 10px;
    border: 1px solid #ccc;
}

.msg-main-div {
    float: left;
    width: 570px;
    color: #1F6383;
}

.msg-content {
    float: left;
    width: 550px;
    margin-top: 10px;
    padding: 3px 10px;
    border: 1px solid #ccc;
    margin-bottom: 25px;
}

.msg-bg {
    background: none repeat scroll 0 0 #F6F6F6;
    float: left;
    margin-top: 1px;
    padding: 0 5px;
    width: 95%;
}

.mtop20 {
    margin-top: 20px !important;
}

.management_section {
    color: #737373;
    font-size: 8pt;
}

.flt {
    float: left;
}

.select_none {
    padding-left: 10px;
}

.select_contact {
    padding-left: 10px;
    color: #000000 !important;
}

.select_delete {
    color: #0000EE;
    font-size: 8pt;
    padding-left: 10px;
}
.reply-msg{
     float: right;
    margin-right: 30px;
}
.message-from-hold input{
    float: left;
    font-family: Verdana,Tahoma,"Trebuchet MS";
    font-size: 12px;
    margin-right: 3px;
    margin-top: 3px;
    padding: 3px;
}
.subscribe_text{
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 10px;
}
#mc_embed input[type="submit"] {
    background-color: #AAAAAA;
    border: 0 none;
    border-radius: 4px 4px 4px 4px;
    clear: both;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 15px;
    font-weight: bold;
    height: 32px;
    line-height: 32px;
    margin: 0 5px 10px 0;
    padding: 0;
    text-align: center;
    text-decoration: none;
    vertical-align: top;
    white-space: nowrap;
    width: auto;
}