/* Leonardo Template CSS First Light Web Design 2007 */

body {background: #000 url(images/page_background.jpg) repeat;
      color: #CCC;
      font-size: 12px;
      font-family: "palatino linotype", "trebuchet ms", "times new roman";
      margin: 0;
      padding: 0;
      text-align: center;} /* Needed to center layout in old IE browsers. */

acronym, abbr {cursor: help;
               border-bottom: 1px dotted #334755;}

/*h1, h2, h3, h4, h5, h6 {margin: 0 0 25px 0;
                        padding: 0;}

ul {list-style-type: square;}*/

p {padding: 0;
   margin: 0 0 25px 0;
   font-size: 10px;}

img {border: 0;
     margin: 0 0 25px 0;}
       
/*h1 {font-size: 34px;}*/
h2 {font-size: 30px;}
h3 {font-size: 26px;}
h4 {font-size: 22px;}
h5 {font-size: 18px;}
h6 {font-size: 14px;}

a {color: #B7B2AE; text-decoration: none;}
a:link {color: #B7B2AE;}
a:visited {color: #B7B2AE;}
a:hover {color: #FFFFFF; text-decoration: none;}
            
#container {width: 980px;
            text-align: left;
            padding: 5px 0 0;
            margin: 10px auto;
            background-color: #000000;
            color: #334755;}

#header {width: 968px;
         height: 109px;
         /*background: #E7EAEB url(images/logokananatas.jpg) no-repeat;*/
		 background: #000000 url(../images/logokananatas.jpg) no-repeat;
         color: #FFFFFF;
         margin: 0 5px;
         padding: 0;
         border: 1px solid #334755;
         position: relative;}

#logo {float: left;
       margin: 0 5px 0 0;
       padding: 0;}



#header h2 {margin: 1px 0 0 20px;
            padding: 0;
            font-size: 14px;
            line-height: 15px;}

/* Begin Search Form CSS */

#search {position: absolute;
         right: 20px;
         top: 54px;}

#search input.text {margin-right: 5px;
                    vertical-align: middle;
                    border: 2px outset #334755;
                    padding: 0.25em;
                    width: 135px;
                    background-color: #E7EAEB;
                    color: #334755;}

#search input.submit
 
{background: #829099 url(../images/menu_background.jpg) bottom left repeat-x;
 color: #334755;
 border: 2px outset #334755;
 vertical-align: middle;
 font-weight: bold;
 padding: 0.4em;
 font-size: 0.8em;}

/* End Search Form CSS */

/* Begin main navigation menu. */

#menu {width: 968px;
       height: 25px;
       margin: 2px 5px 0;
      /* background: #829099 url(../images/menu_background.jpg) repeat-x;
       border: 1px solid #334755;*/}


/* End main navigation menu. */ 

/* The leftcolumn division is your main content division. */

#leftcolumnhome {float: left;
             width: 400px;
			 height: 768px;
             padding: 0;
             margin: 0 0 0 6px;
			 background: url(../images/bgcompany2.jpg) no-repeat;
			 }

* html #leftcolumnhome {margin: 0 0 0 13px} /* IE Hack */

#leftproduk {float: left;
             width: 400px;
			 height: 768px;
             padding: 0;
             margin: 0 0 0 6px;
			 background: url(../images/product.jpg) no-repeat;
			 }

* html #leftproduk {margin: 0 0 0 13px} /* IE Hack */

#leftcolumnvisi {float: left;
             width: 400px;
			 height: 768px;
             padding: 0;
             margin: 0 0 0 6px;
			 background: url(../images/bgvision.jpg) no-repeat;
			 }
* html #leftcolumnvisi {margin: 0 0 0 13px} /* IE Hack */


#leftcolumnservis {float: left;
             width: 400px;
			 height: 768px;
             padding: 0;
             margin: 0 0 0 6px;
			 background: url(../images/bgservices.jpg) no-repeat;
			 }
* html #leftcolumnservis {margin: 0 0 0 13px} /* IE Hack */


#leftcolumnkontak {float: left;
             width: 400px;
			 height: 768px;
             padding: 0;
             margin: 0 0 0 6px;
			 background: url(../images/bgcontact.jpg) no-repeat;
			 }
* html #leftcolumnkontak {margin: 0 0 0 13px} /* IE Hack */

#rightcolumn {float: left;
              width: 530px;
              padding: 0;
			  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF;
              margin: 0 0 0 25px;}

#rightcolumn h5, #rightcolumn h6 {border-bottom: 1px solid #98A5AE;
                                  padding: 0 0 2px 0;}

#footer {width: 968px;
         clear: both;
         margin: 0 5px;
         font-size: 11px;
         text-align: center;}

#footer p {padding: 5px 0;
           margin: 0;}

.left {float: left;
       margin: 5px 5px 0 0;}

.right {float: right;
        margin: 5px 0 0 5px;}

.justify {text-align: justify;}

/* Begin topics list. It could instead be used for a list of links. */

#topics {width: 246px;
         margin-bottom: 25px;}

#topics ul {margin: 0;
            padding: 0;
            list-style-type: none;}

#topics li {margin: 0 0 1px;}

#topics a {display: block;
           padding: 3px 0 3px 10px;
           width: 230px;
           background: #829099 url(../images/topics_background.jpg) repeat-x;
           color: #334755;
           border-left: 5px solid #334755;
           border-top: 1px solid #334755;
           border-bottom: 1px solid #334755;
           border-right: 1px solid #334755;
           text-decoration: none;}

#topics a:hover {border-left: 5px solid #4F6C7F;
                 border-top: 1px solid #4F6C7F;
                 border-bottom: 1px solid #4F6C7F;
                 border-right: 1px solid #4F6C7F;
                 background: #ACCBDF url(../images/topics_background.jpg) repeat-x;
                 background-position: 0 -25px;
                 color: #334755;}

/* End topics list. */

.date {float: right;
       font-size: 11px;
       margin: 7px 0 0;
       font-style: italic;}

.menuProduct {float: left;
       font-size: 11px;
       margin: 7px 0 0;
       font-style: bold;}

.divider {width: 968px;
          height: 11px;
          clear: both;
          margin: 2px 5px 0;
          background: #E7EAEB url(../images/divider.jpg) repeat-x;
          color: #334755;}

.divider2 {margin: 0 0 25px;
           border-bottom: 1px solid #98A5AE;}

p.featured {border: 1px solid #98A5AE;
            padding: 5px 5px 20px;
            background: #E7EAEB url(../images/gradient.jpg) repeat-x;
            color: #334755;}
/*-----------------------------*/
/*h1 ul{padding:0px; margin:0px;}*/

ul{list-style-type:none;}

#topPan{width:100px; height:10px; position:relative; margin:0 auto;}
#topPan ul {width:600px;}
#topPan ul li{float:left; font:12px/30px Trebuchet MS, Arial, Helvetica, sans-serif; font-weight:bold; text-transform:uppercase;}
#topPan ul li a{width:92px; height:30px; display:block; background:url(../images/menubg-normal.gif) 0 0 no-repeat #66605B; color:#FDFDFD;  text-decoration:none; text-align:center;}
#topPan ul li a:hover{background:url(../images/menubg-hover.gif) 0 0 no-repeat #66605B; color:#1A1917;}
#topPan ul li.menupadding{margin:0 0 0 1px;}
#topPan ul li.home{width:92px; height:30px; display:block; background:url(../images/menubg-hover.gif) 0 0 no-repeat #FDFDFD; color:#1A1917; text-align:center;}
#topPan ul li a:active{width:92px; height:30px; display:block;}



