h1,h2,h3,h4,h5,h6{ font-family: 'Yanone Kaffeesatz', Arial, sans-serif; font-weight: 400; } h1{ font-size: 48px;} h2{ font-size: 36px; } h3{ font-size: 24px; } h4{ font-size: 21px; } h5{ font-size: 18px; } h6{ font-size: 14px; } a { text-decoration: none; color: #000; } a:hover { text-decoration: underline; color: #385d8a; } input, select { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; } body { background: url(img/bg-body.png) repeat center center fixed; } .spacer { width: 10%; float: left; min-height: 1px; } .main { background: url(http://dnbs.url.ph/img/main.png) top center repeat; float: left; width: 80%; min-height: 100%; padding: 10px; overflow: hidden; } .header { float: left; width: 100%; background-color: #d4d4d4; min-height: 10px; margin-left: -2px; border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; } .header img { width: 100%; height: 200px; border-radius: 10px; -moz-border-radius: 10px; -ms-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; } .nav_dalam { float: left; width: 100%; background-color: #bcbbbb; min-height: 40px; } .nav_dalam ul { width: 100%; float: left; margin-top: 10px; margin-left: 10px; } .nav_dalam li { padding: 5px 20px; display: inline-block; border-left: 1px #000 solid; } .nav_dalam li:last-child { border-right: 1px #000 solid; } .nav_dalam span { font: 17px Agency; } .sidebar_dalam { float: left; width: 17%; background-color: #a9c1df; min-height: 500px; margin: 5px 5px 5px 0px; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; -ms-border-radius: 10px; } .sidebar_dalam img { width: 100%; float: left; } .sidebar_dalam td { padding: 1px 10px; } .sidebar_dalam p { font-size: 14px; } .sidebar_dalam input { margin-bottom: 3px; } .content_dalam { float: left; width: 82%; background-color: #d4d4d4; min-height: 10px; margin: 5px 0px 5px 5px; } .footer_dalam { float: left; width: 105%; background-color: #383838; margin-left: -20px; margin-bottom: -10px; height: 30px; padding: 5px; } .footer_dalam p { float: left; font: 14px gungsuh; margin-top: 5px; margin-left: 20px; margin-right: 35px; } #header { bottom: auto; position: fixed; top: 0; height:100px; background: url(img/header.png) top center; width:100%; } #logo { bottom: auto; position: fixed; top: 0; z-index: 100; height: 145px; width: 250px; margin-left: 300px; } #nav { margin-top: 100px; bottom: auto; position: fixed; top: 0; z-index: 80; height: 50px; background-color: #d9d9d9; width: 100%; } .col3, .col9 { float: left; min-height: 1px; margin: 0px 0px; margin-top: 150px; } .col3 { width: calc(15% - 16px); padding: 0px; position: fixed; } .col9 { width: calc(100% - 16px); padding: 5px; } .content, .sidebar { margin: 0px 0px; } .content { margin-left: 190px; background-color: #fff; margin-bottom: 30px; padding: 10px; } .sidebar { background: #a9c1df; height: 480px; border: 2px solid #385d8a; } .sidebar input { margin-bottom: 3px; } .sidebar img { width: 100%; margin: 5px 0px; } #img-sidebar { margin-top: -5px; margin-bottom: -6px; } .sidebar table { width: 100%; } .sidebar table p { font-size: 15; } .sidebar table tr td { padding-left: 12px; } .contact { text-align: center; } .contact strong { text-decoration: bold; } .tombol { margin-left: 0px; } #footer { background: url(img/footer.png) top center; bottom: 0; height: 10px; padding: 10px; position: fixed; top: auto; width: 100%; z-index: 90; } .site-header ul { float: left; padding: 10px 20px; overflow: hidden; } .site-header li { width: 200px; border: 2px solid #000; background-color: #e9e9e9; border-radius: 10px; -moz-border-radius: 10px; -webkit-border-radius: 10px; -o-border-radius: 10px; display: inline; padding: 10px 20px; margin-right: 20px; box-shadow: 100px; } .site-header li:hover { opacity: 0.8; } .site-header span { color: #000; display: inline-block; font: 20px calibri ; width: 100px; text-align: center; } .site-header span:hover { color: #0731cb; } #right { float: right; } #left { float: left; } #logo { position: fixed; z-index: 120; } #kanan { float: right; margin-right: 50px; } #center { float: center; margin-left: 160px; } .tengah { text-align: center; } .layang { vertical-align: middle; } .full { width: 100%; } #loading { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(img/loading.gif) 50% 50% no-repeat #fff; } #kolom-luar-berita { width: 887px; } #kolom-berita { width: 420px; height: 180px; margin-left: 2.5px; margin-bottom: 5px; float: left; background-color: #a9c1df; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; padding: 10px; } #kolom-berita table { width: 100%; } #kolom-berita img { float: left; } .paging { padding-top: 10px; padding-bottom: -5px; width: 30px; height: 25px; border: 1px solid #fff; background-color: #a9c1df; } .judul-berita { font-family: Calibri; font-size:30px; line-height:140%; padding-left:0px; color:#FFF; width:500px; font-weight:bold; text-shadow:2px 2px 2px #666; padding-top: -100px; } .bag-page { margin-top: 385px; } .modul { width: 100%; border: 1px solid #fff; line-height: 20px; } .modul th { border: 1px solid #fff; line-height: 20px; padding: 5px; } .modul tr td { border: 1px solid #fff; line-height: 20px; padding: 5px; } .bag-page-modul { margin-top: 20px; } .single { width: 100%; margin: 10px 0 0 10px; } .img-berita { margin-top: 10px; margin-right: 10px; width: 250px; border: 1px solid #fff; float: left; } .single p { margin-top: 10px; margin-left: 10px; line-height: 110%; font: 15px sans-serif; } @media screen and (max-width: 1200px){ .main { width: 100%; } }