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

body {
padding: 0px;
margin: 0px;
color: #333333;
font-family:Helvetica, Arial, Calibri, sans-serif;
/*background-image:url('images/budaya_mainbg.jpg');*/
height: 100%;
background:#003366;
}

html{
height: 100%;
}

#BackgroundTop{
width:100%;
height:100%;
position:fixed;
top:0px;
left:0px;
z-index:-100;
}

#BackgroundBottom{
width:100%;
height:100%;
position:absolute;
top:0px;
left:0px;
z-index:1;
}

#container{
width:100%;
height:94%;
position:absolute;
top:3%;
left:0px;
z-index:100;
}

#footer {
position:absolute;
bottom:0px;
width:100%;
height:3%;
text-align:center;
z-index:100;
}

#footer a{
color:#333333;
text-decoration:none;
outline: 0 none;
}

#footer a:hover{
color: #FF6600;
text-decoration:none;
outline: 0 none;
}

#logo_bar{
position:absolute;
top: 0px;
right: 0px;
width: 60px;
height: 100%;
background: url(img/trans/logobg.png) repeat;
z-index:2;
}


#menu_box{
position:relative;
left:0px;
display:block;
width: 220px;
height: 100%;
}

#menu{
position:relative;
left:0px;
display:block;
width: 200px;
height: 100%;
background: url('img/trans/k100.png') repeat;
}

#shadow_one{
position:absolute;
top:0px;
left:200px;
width: 20px;
height: 100%;
background: url('img/shadow.png') repeat-y;
z-index: 110;
}

#about_box, #news_box, #contact_box{
position:absolute;
left:200px;
top:0px;
display:none;
width: 620px;
height: 100%;
}

#about, #news, #contact{
position:absolute;
left:0px;
top:0px;
width: 600px;
height: 100%;
background: url('img/trans/k00.png') repeat;
overflow-y: auto;
overflow-x: hidden;
}

#shadow_two{
position:absolute;
left:600px;
top:0px;
width: 20px;
height: 100%;
background: url('img/shadow.png') repeat-y;
z-index: 110;
}

#projects_box{
position:absolute;
top:0px;
left:200px;
display:none;
width: 220px;
height: 100%;
}

#projects{
position:absolute;
top:0px;
left:0px;
width: 200px;
height: 100%;
background: url('img/trans/k80.png') repeat;
padding-top: 0px;
}

#shadow_three{
position:absolute;
top:0px;
left:200px;
width: 20px;
height: 100%;
background: url('img/shadow.png') repeat-y;
z-index: 110;
}

#broadcast_content, #short_content, #educational_content, #inproduction_content{
position:absolute;
left:0px;
top:0px;
width: 600px;
height: 100%;
background: url('img/trans/k00.png') repeat;
overflow-y: auto;
overflow-x: hidden;
}

#broadcast, #short, #educational, #inproduction{
position:absolute;
left:200px;
top:0px;
display:none;
width: 620px;
height: 100%;
}

#shadow_four{
position:absolute;
top:0px;
left:600px;
width: 20px;
height: 100%;
background: url('img/shadow.png') repeat-y;
z-index: 110;
}

h1 {
margin: 0px;
padding: 0px;
font-size: 24px;
font-weight:normal;
line-height:110%;
}

h2{
margin: 0px;
padding:0px;
font-size: 22px;
font-weight:normal;
line-height:100%;
}

h3{
margin: 0px;
padding: 0px;
font-size: 18px;
font-weight:normal;
line-height:100%;
display:inline;
text-align:justify;
}

h4{
margin: 0px;
padding: 0px;
font-size: 18px;
font-weight:normal;
line-height:100%;
}

h7{
margin: 0px;
padding: 0px;
font-size: 9px;
font-weight:normal;
line-height:100%;
color:#333333;
}

.five{
margin: 0px;
font-size: 22px;
font-weight:normal;
line-height:100%;
}

a {
color: #000000;
text-decoration: none;
outline: 0 none;
}

a:hover {
color: #CCCCCC;
text-decoration: none;
outline: none;
}

a:active {
color: #000000;
text-decoration: none;
outline: none;
}

.menu1.active a, .menu2.active a{
color:#FFCC33;
text-decoration: none;
outline: 0 none;
}

.menu3.active{
color:#FFCC33;
text-decoration: none;
outline: 0 none;
}

.menu2 a:hover, .menu1 a:hover{
color:#FFCC33;
text-decoration: none;
outline: 0 none;
}

#short_menu a:hover, #broadcast_menu a:hover, #inproduction_menu a:hover, #educational_menu a:hover{
color:#FFCC33;
text-decoration: none;
outline: 0 none;
}

.menu2 a, .menu1 a{
color:#ffffff;
text-decoration: none;
outline: 0 none;
}

#short_menu a, #broadcast_menu a, #inproduction_menu a, #educational_menu a{
color:#333333;
text-decoration: none;
outline: 0 none;
}

.bc_item, .sc_item, .ed_item, .ip_item{
display:none;
height: auto;
width: auto;
margin:10px;
}

.content {
padding-top: 15px;
padding-left: 10px;
padding-right: 10px;
width: auto;
}


#short_container, #broadcast_container, #inproduction_container, #educational_container  {
width: auto;
height: 100%;
padding-left:10px;
padding-right:10px;
}

#short_menu, #broadcast_menu, #inproduction_menu, #educational_menu {
height: auto;
width: 100%;
padding-top: 15px;
padding-bottom: 5px;
}



#item_container_1 {
position: relative;
width: 100%;

}

#item_container_3 {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: auto;
}

span5{
margin: 0px;
padding-left: 10px;
font-size: 22px;
font-weight:normal;
line-height:100%;
}