/* reset.css */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
article, aside, dialog, figure, footer, header, hgroup, nav, section {display:block;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}
/* typography.css */
@font-face {
font-family: 'Roboto';
src: url('../fonts/Roboto-Regular.eot');
src: local('.'), url('../fonts/Roboto-Regular.woff') format('woff'), url('../fonts/Roboto-Regular.ttf') format('truetype'), url('../fonts/Roboto-Regular.svg#webfontTQ8DxsqV') format('svg');
font-weight: normal;
font-style: normal;
}
html {font-size:100.01%;}
body {font-size:80%;color:#fff;background:#043f45;font-family:Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6 {font-weight:bold;color:#fff;font-family:Roboto, arial, helvetica, serif;}
h1 {font-size:3em;line-height:1;margin-bottom:0.5em;}
h2 {font-size:2em;margin-bottom:0.75em;}
h2.title a {text-decoration:none;line-height:0.95em;color:#5b5b5b;}
h2.title a:hover {color:#000;}
h3 {font-size:1.5em;line-height:1;margin-bottom:1em;}
h4 {font-size:1.2em;line-height:1.25;margin-bottom:1.25em;}
h5 {font-size:1em;font-weight:bold;margin-bottom:1.5em;}
h6 {font-size:1em;font-weight:bold;}
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img {margin:0;}
p {margin:0 0 1.5em;}
p img.left {float:left;margin:1.5em 1.5em 1.5em 0;padding:0;}
p img.right {float:right;margin:1.5em 0 1.5em 1.5em;}
a:focus, a:hover {color:#fff;text-decoration:none}
a {color:#e9e100;text-decoration:none;}
blockquote {margin:1.5em;color:#666;font-style:italic;}
strong {font-weight:bold;}
em, dfn {font-style:italic;}
dfn {font-weight:bold;}
sup, sub {line-height:0;}
abbr, acronym {border-bottom:1px dotted #666;}
address {margin:0 0 1.5em;font-style:italic;}
del {color:#666;}
pre {margin:1.5em 0;white-space:pre;}
pre, code, tt {font:1em 'andale mono', 'lucida console', monospace;line-height:1.5;}
code {background-color:transparent;color:#919191;padding:1px;}
li ul, li ol {margin:0;}
ul, ol {margin:0 1.5em 1.5em 0;padding-left:3.333em;}
ul {list-style-type:disc;}
ol {list-style-type:decimal;}
dl {margin:0 0 1.5em 0;}
dl dt {font-weight:bold;}
dd {margin-left:1.5em;}
table {margin-bottom:1.4em;width:100%;}
th {font-weight:bold;}
thead th {background:#c3d9ff;}
th, td, caption {padding:4px 10px 4px 5px;}
tr.even td {background:#e5ecf9;}
tfoot {font-style:italic;}
caption {background:#eee;}
.small {font-size:.8em;margin-bottom:1.875em;line-height:1.875em;}
.large {font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide {display:none;}
.quiet {color:#666;}
.loud {color:#000;}
.highlight {background:#ff0;}
.added {background:#060;color:#fff;}
.removed {background:#900;color:#fff;}
.first {margin-left:0;padding-left:0;}
.last {margin-right:0;padding-right:0;}
.top {margin-top:0;padding-top:0;}
.bottom {margin-bottom:0;padding-bottom:0;}
.header {width:1190px;height:85px;background:transparent url('../images/tiraos-logo.png') no-repeat 50% 0;}
.iconrak {background:transparent;border:0 none; text-align:center;float:left;margin:0px;padding:0px;font-size:11px/16px;color:#bcd0d1;width:90px;height:100px;font-weight:normal;font-family:Roboto, arial,verdana, tahoma;cursor:pointer;}
.iconrakright {background:transparent;border:0 none; text-align:center;float:left;margin:0px;padding:0px;font-size:10px/16px;color:#bcd0d1;width:90px;height:100px;font-weight:normal;font-family:Roboto, arial,verdana, tahoma;cursor:pointer;}
.iconraktop {background:transparent;border:0 none; text-align:center;float:left;margin:20px 0px 0px 0px;padding:10px;font-size:11px/16px;color:#bcd0d1;width:100px;height:100px;font-weight:normal;font-family:arial,verdana, tahoma;cursor:pointer;}
.iconrak:hover, .iconraktop:hover, .iconrakright:hover {border:0 none;color:#fff;}
.iconrak img, .iconraktop img, .iconrakright img {filter:alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
}
.iconrak img:hover, .iconraktop img:hover, .iconrakright img:hover {filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity: 1;
}
.wrapper {height:500px;margin-top:10px;}
.userinfo {background:#295b60;height:100%;}
.userinfo h2 {text-align:center;text-shadow:1px 1px 1px #000;}
.inside {width:364px;margin:13px;}
.ticker {background:#295b60;height:28px;margin-bottom:50px;font-size:12px;line-height:28px;font-style:italic;}
.contenthide {background: #295b60;padding-top:20px;padding-bottom:20px;}
#footer {clear:both;background:transparent;border-top:1px solid #295b60;padding: 5px 0;font-size:11px;color:#fff;margin:10px 0px;text-align:center; font-family:Roboto, arial, helvetica, serif;}
* html #footer {background-image:none;padding-bottom:0px;}
* html #footer p {height:36px;}
#footer p {height:36px;margin:0 auto;text-align:center;}
#footer a {color:#fff;text-decoration:none;font-weight:bold}
#footer a:hover {color:#CCF1F0}
/* forms.css */
label {font-weight:bold;}
fieldset {padding:1.4em;margin:0 0 1.5em 0;border:1px solid #ccc;}
legend {font-weight:bold;font-size:1.2em;}
input[type=text], input[type=password], input.text, input.title, textarea, select {background-color:#fff;}
input[type=text]:focus, input[type=password]:focus, input.text:focus, input.title:focus, textarea:focus, select:focus {border-color:#666;}
input[type=text], input[type=password], input.text, input.title, textarea, select {margin:0.5em 0;}
input.text, input.title {width:300px;padding:8px;}
input.title {font-size:1.5em;}
textarea {width:390px;height:250px;padding:5px;}
input[type=checkbox], input[type=radio], input.checkbox, input.radio {position:relative;top:.25em;}
input[type="submit"], input[type="button"], .form_button a {background:#011d21;border:0 none;font-weight:normal; color:#fff; white;font-weight:bold;padding:8px 16px;font-size:12px;}
input[type="submit"]:active, input[type="button"]:active, .form_button a:active {background:#084d54;}
form.inline {line-height:3;}
form.inline p {margin-bottom:0;}
.error, .notice, .success {padding:.8em;margin-bottom:1em;border:1px solid #ddd;}
.error {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}
.note {color:red;font-weight:bold;}
/* A container should group all your columns. */
.container {
width: 1190px;
margin: 0 auto;
}
/* Use this class on any div.span / container to see the grid. */
.showgrid {
background: url(src/grid.png);
}
/* Body margin for a sensile default look. */
body {
margin:1.5em 0;
}
/* Columns
-------------------------------------------------------------- */
/* Sets up basic grid floating and margin. */
div.span-1, div.span-2, div.span-3, div.span-4, div.span-5, div.span-6, div.span-7, div.span-8, div.span-9, div.span-10, div.span-11, div.span-12, div.span-13, div.span-14, div.span-15, div.span-16, div.span-17, div.span-18, div.span-19, div.span-20, div.span-21, div.span-22, div.span-23, div.span-24 {float:left;margin-right: 10px;}
/* The last column in a row needs this class. */
div.last { margin-right: 0; }
/* Use these classes to set the width of a column. */
.span-1 { width: 40px;}
.span-2 { width: 90px;}
.span-3 { width: 140px;}
.span-4 { width: 190px;}
.span-5 { width: 240px;}
.span-6 { width: 290px;}
.span-7 { width: 340px;}
.span-8 { width: 390px;}
.span-9 { width: 440px;}
.span-10 { width: 490px;}
.span-11 { width: 540px;}
.span-12 { width: 590px;}
.span-13 { width: 640px;}
.span-14 { width: 690px;}
.span-15 { width: 740px;}
.span-16 { width: 790px;}
.span-17 { width: 840px;}
.span-18 { width: 890px;}
.span-19 { width: 940px;}
.span-20 { width: 990px;}
.span-21 { width: 1040px;}
.span-22 { width: 1090px;}
.span-23 { width: 1140px;}
.span-24, div.span-24 { width: 1190px; margin: 0; }
/* Add these to a column to append empty cols. */
.append-1 { padding-right: 50px;}
.append-2 { padding-right: 100px;}
.append-3 { padding-right: 150px;}
.append-4 { padding-right: 200px;}
.append-5 { padding-right: 250px;}
.append-6 { padding-right: 300px;}
.append-7 { padding-right: 350px;}
.append-8 { padding-right: 400px;}
.append-9 { padding-right: 450px;}
.append-10 { padding-right: 500px;}
.append-11 { padding-right: 550px;}
.append-12 { padding-right: 600px;}
.append-13 { padding-right: 650px;}
.append-14 { padding-right: 700px;}
.append-15 { padding-right: 750px;}
.append-16 { padding-right: 800px;}
.append-17 { padding-right: 850px;}
.append-18 { padding-right: 900px;}
.append-19 { padding-right: 950px;}
.append-20 { padding-right: 1000px;}
.append-21 { padding-right: 1050px;}
.append-22 { padding-right: 1100px;}
.append-23 { padding-right: 1150px;}
/* Add these to a column to prepend empty cols. */
.prepend-1 { padding-left: 50px;}
.prepend-2 { padding-left: 100px;}
.prepend-3 { padding-left: 150px;}
.prepend-4 { padding-left: 200px;}
.prepend-5 { padding-left: 250px;}
.prepend-6 { padding-left: 300px;}
.prepend-7 { padding-left: 350px;}
.prepend-8 { padding-left: 400px;}
.prepend-9 { padding-left: 450px;}
.prepend-10 { padding-left: 500px;}
.prepend-11 { padding-left: 550px;}
.prepend-12 { padding-left: 600px;}
.prepend-13 { padding-left: 650px;}
.prepend-14 { padding-left: 700px;}
.prepend-15 { padding-left: 750px;}
.prepend-16 { padding-left: 800px;}
.prepend-17 { padding-left: 850px;}
.prepend-18 { padding-left: 900px;}
.prepend-19 { padding-left: 950px;}
.prepend-20 { padding-left: 1000px;}
.prepend-21 { padding-left: 1050px;}
.prepend-22 { padding-left: 1100px;}
.prepend-23 { padding-left: 1150px;}
/* Border on right hand side of a column. */
div.border {
padding-right:4px;
margin-right:5px;
border-right: 1px solid #eee;
}
/* Border with more whitespace, spans one column. */
div.colborder {
padding-right:38px;
margin-right:35px;
border-right: 1px solid #eee;
}
/* Use these classes on an element to push it into the
next column, or to pull it into the previous column. */
.pull-1 { margin-left: -50px;}
.pull-2 { margin-left: -100px;}
.pull-3 { margin-left: -150px;}
.pull-4 { margin-left: -200px;}
.pull-5 { margin-left: -250px;}
.pull-6 { margin-left: -300px;}
.pull-7 { margin-left: -350px;}
.pull-8 { margin-left: -400px;}
.pull-9 { margin-left: -450px;}
.pull-10 { margin-left: -500px;}
.pull-11 { margin-left: -550px;}
.pull-12 { margin-left: -600px;}
.pull-13 { margin-left: -650px;}
.pull-14 { margin-left: -700px;}
.pull-15 { margin-left: -750px;}
.pull-16 { margin-left: -800px;}
.pull-17 { margin-left: -850px;}
.pull-18 { margin-left: -900px;}
.pull-19 { margin-left: -950px;}
.pull-20 { margin-left: -1000px;}
.pull-21 { margin-left: -1050px;}
.pull-22 { margin-left: -1100px;}
.pull-23 { margin-left: -1150px;}
.pull-24 { margin-left: -1200px;}
.pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8, .pull-9, .pull-10, .pull-11, .pull-12, .pull-13, .pull-14, .pull-15, .pull-16, .pull-17, .pull-18, .pull-19, .pull-20, .pull-21, .pull-22, .pull-23, .pull-24 {float:left;position:relative;}
.push-1 { margin: 0 -50px 1.5em 50px;}
.push-2 { margin: 0 -100px 1.5em 100px;}
.push-3 { margin: 0 -150px 1.5em 150px;}
.push-4 { margin: 0 -200px 1.5em 200px;}
.push-5 { margin: 0 -250px 1.5em 250px;}
.push-6 { margin: 0 -300px 1.5em 300px;}
.push-7 { margin: 0 -350px 1.5em 350px;}
.push-8 { margin: 0 -400px 1.5em 400px;}
.push-9 { margin: 0 -450px 1.5em 450px;}
.push-10 { margin: 0 -500px 1.5em 500px;}
.push-11 { margin: 0 -550px 1.5em 550px;}
.push-12 { margin: 0 -600px 1.5em 600px;}
.push-13 { margin: 0 -650px 1.5em 650px;}
.push-14 { margin: 0 -700px 1.5em 700px;}
.push-15 { margin: 0 -750px 1.5em 750px;}
.push-16 { margin: 0 -800px 1.5em 800px;}
.push-17 { margin: 0 -850px 1.5em 850px;}
.push-18 { margin: 0 -900px 1.5em 900px;}
.push-19 { margin: 0 -950px 1.5em 950px;}
.push-20 { margin: 0 -1000px 1.5em 1000px;}
.push-21 { margin: 0 -1050px 1.5em 1050px;}
.push-22 { margin: 0 -1100px 1.5em 1100px;}
.push-23 { margin: 0 -1150px 1.5em 1150px;}
.push-24 { margin: 0 -1200px 1.5em 1200px;}
.push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8, .push-9, .push-10, .push-11, .push-12, .push-13, .push-14, .push-15, .push-16, .push-17, .push-18, .push-19, .push-20, .push-21, .push-22, .push-23, .push-24 {float:right;position:relative;}
/* Misc classes and elements
-------------------------------------------------------------- */
/* Use a .box to create a padded box inside a column. */
.box {
padding: 1.5em;
margin-bottom: 1.5em;
background: #E5ECF9;
}
/* Use this to create a horizontal ruler across a column. */
hr {
background: #ddd;
color: #ddd;
clear: both;
float: none;
width: 100%;
height: .1em;
margin: 0 0 1.45em;
border: none;
}
hr.space {
background: #fff;
color: #fff;
}
/* Clearing floats without extra markup
Based on How To Clear Floats Without Structural Markup by PiE
[http://www.positioniseverything.net/easyclearing.html] */
.clearfix:after, .container:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix, .container {display: inline-block;}
* html .clearfix,
* html .container {height: 1%;}
.clearfix, .container {display: block;}
/* Regular clearing
apply to column that should drop below previous ones. */
.clear { clear:both; }
/* Tooltips CSS definitions */
/* tambahan */
#load{
margin: 0; top: 0;
position: fixed;
width: 100%; height:100%; overflow: hidden;
background-image: url('../images/load.png');
z-index: 1;
}
#kotak0{
position:absolute;
top: 50%;
left: 50%;
width:410px;
height:160px;
margin-top: -9em; /*set to a negative number 1/2 of your height*/
margin-left: -15em; /*set to a negative number 1/2 of your width*/
border: solid #011d21 1px;
background-color: #08565c;
text-align: center;
z-index: 1;
-moz-border-radius: 12px 12px 12px 12px;
-webkit-border-bottom-left-radius: 12px;
-webkit-border-bottom-right-radius: 12px;
-khtml-border-bottom-left-radius: 12px;
-khtml-border-bottom-right-radius: 12px;
border-bottom-left-radius: 12px;
border-bottom-right-radius: 12px
}
#kotak1{
width: 160px; height: 110px;
margin-left: 20px;
text-align: left; font-size: 14px;
line-height:33px;
font-family: arial, verdana, helvetica, serif;
}
* html #kotak1 {margin-left:-15em;margin-top:25px;line-height:20px;}
#kotak2{
position: relative; left:210px; top:-112px; width:180px; height:110px; text-align:right;
}
* html #kotak2 {margin-left:-18em;margin-top:0px;}