@charset "utf-8";
/* CSS Document */

body {background:url(image/daun.jpeg) ; }


/*WHOLE PAGE*/
.page { width:80%; 
		margin:auto;
		padding:10px;}
	
/*HEADER SECTION*/
ul {list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color:#060 ;
	font-family:Lucida Sans ;}

li {float: left;}

li a, .dropbtn {display: inline-block;
                color: white;
                text-align: center;
                padding: 14px 16px;
                text-decoration: none;}

li a:hover, .dropdown:hover .dropbtn {background-color:#093;}

li.dropdown {display: inline-block;}

.dropdown-content {display: none;
                   position: absolute;
                   background-color: #f9f9f9;
                   min-width: 160px;
                   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}

.dropdown-content a {color: black;
                     padding: 12px 16px;
                     text-decoration: none;
                     display: block;
                     text-align: left;}

.dropdown-content a:hover {background-color:#093;}

.dropdown:hover .dropdown-content {display: block;}




/*MAIN SECTION*/
main {background-color:#FF6;
      margin: auto;
	  width:70%;
	  float:left;
	  padding:10px}
		
table {border-collapse: collapse;
       width: 100%;}

th, td {text-align: left;
        padding: 8px;}

tr:nth-child(even){background-color: #f2f2f2}

th {background-color: #4CAF50;
    color: black;}

div.img {margin: 5px;
         border: 1px solid #ccc;
         float: left;
         width: 180px;}

div.img:hover {border: 1px solid #777;}

div.img img {width: 100%;
             height: auto;}

div.desc {padding: 15px;
          text-align: center;}

/*SIDEBAR SECTION*/
.sidebar {background-color:transparent;
          margin: auto;
		  width:25%;
		  float:right;
		  padding:10px;}


/*FOOTER SECTION*/
.footer-kaki {background-color:#F93;
			  clear:both;}