html { font-family: sans-serif; }
body { margin: 0px; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }
audio:not([controls]) { display: none; height: 0px; }
a { background-color: transparent; }
a:active, a:hover { outline: 0px none; }
b, strong { font-weight: 700; }
img { border: 0px none; }
svg:not(:root) { overflow: hidden; }
button, input, optgroup, select, textarea { margin: 0px; font: inherit; color: inherit; }
button, select { text-transform: none; }
button, html input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; }
button::-moz-focus-inner, input::-moz-focus-inner { padding: 0px; border: 0px none; }

@font-face {
	font-family: "Glyphicons Halflings";
	src: url('../font/glyphicons-halflings-regular.eot') format("embedded-opentype"), url('../font/glyphicons-halflings-regular.woff2') format("woff2"), url('../font/glyphicons-halflings-regular.woff') format("woff"), url('../font/glyphicons-halflings-regular.ttf') format("truetype"), url('../font/glyphicons-halflings-regular.svg') format("svg");
}
.glyphicon { position: relative; top: 1px; display: inline-block; font-family: "Glyphicons Halflings"; font-style: normal; font-weight: 400; line-height: 1; }

html { font-size: 10px; }
body { font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 14px; line-height: 1.42857; color: rgb(51, 51, 51); background-color: rgb(255, 255, 255); }
button, input, select, textarea { font-family: inherit; font-size: inherit; line-height: inherit; }
a { color: rgb(51, 122, 183); text-decoration: none; }
a:focus, a:hover { color: rgb(35, 82, 124); text-decoration: underline; }
a:focus { outline: thin dotted; outline-offset: -2px; }
img { vertical-align: middle; }
p { margin: 0px 0px 10px; }
blockquote .small::before, blockquote footer::before, blockquote small::before { content: "— "; }
.blockquote-reverse .small::before, .blockquote-reverse footer::before, .blockquote-reverse small::before, blockquote.pull-right .small::before, blockquote.pull-right footer::before, blockquote.pull-right small::before { content: ""; }
.blockquote-reverse .small::after, .blockquote-reverse footer::after, .blockquote-reverse small::after, blockquote.pull-right .small::after, blockquote.pull-right footer::after, blockquote.pull-right small::after { content: " —"; }
.container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
.container-fluid { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; }
.row { margin-right: -15px; margin-left: -15px; }
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 { position: relative; min-height: 1px; padding-right: 15px; padding-left: 15px; }
table { background-color: transparent; }
.table-striped > tbody > tr:nth-of-type(2n+1) { background-color: rgb(249, 249, 249); }
@media screen and (max-width: 767px) {
}
.form-control::-moz-placeholder { color: rgb(153, 153, 153); opacity: 1; }
@media not all {
}
.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { border-radius: 0px; }
.btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.btn-group > .btn:last-child:not(:first-child), .btn-group > .dropdown-toggle:not(:first-child) { border-top-left-radius: 0px; border-bottom-left-radius: 0px; }
.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn { border-radius: 0px; }
.btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child { border-top-left-radius: 0px; border-bottom-left-radius: 0px; }
.btn-group-vertical > .btn:not(:first-child):not(:last-child) { border-radius: 0px; }
.btn-group-vertical > .btn:first-child:not(:last-child) { border-radius: 4px 4px 0px 0px; }
.btn-group-vertical > .btn:last-child:not(:first-child) { border-radius: 0px 0px 4px 4px; }
.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn { border-radius: 0px; }
.btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child, .btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle { border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; }
.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child { border-top-left-radius: 0px; border-top-right-radius: 0px; }
.input-group .form-control:not(:first-child):not(:last-child), .input-group-addon:not(:first-child):not(:last-child), .input-group-btn:not(:first-child):not(:last-child) { border-radius: 0px; }
.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn-group:not(:last-child) > .btn, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) { border-top-right-radius: 0px; border-bottom-right-radius: 0px; }
.input-group .form-control:last-child, .input-group-addon:last-child, .input-group-btn:first-child > .btn-group:not(:first-child) > .btn, .input-group-btn:first-child > .btn:not(:first-child), .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-btn:last-child > .dropdown-toggle { border-top-left-radius: 0px; border-bottom-left-radius: 0px; }
.breadcrumb > li + li::before { padding: 0px 5px; color: rgb(204, 204, 204); content: "/ "; }
@media screen and (min-width: 768px) {
}
.popover > .arrow, .popover > .arrow::after { position: absolute; display: block; width: 0px; height: 0px; border-color: transparent; border-style: solid; }
.popover > .arrow::after { content: ""; border-width: 10px; }
.popover.top > .arrow::after { bottom: 1px; margin-left: -10px; content: " "; border-top-color: rgb(255, 255, 255); border-bottom-width: 0px; }
.popover.right > .arrow::after { bottom: -10px; left: 1px; content: " "; border-right-color: rgb(255, 255, 255); border-left-width: 0px; }
.popover.bottom > .arrow::after { top: 1px; margin-left: -10px; content: " "; border-top-width: 0px; border-bottom-color: rgb(255, 255, 255); }
.popover.left > .arrow::after { right: 1px; bottom: -10px; content: " "; border-right-width: 0px; border-left-color: rgb(255, 255, 255); }
@media not all, (-webkit-transform-3d) {
}
.carousel-control .icon-prev::before { content: "‹"; }
.carousel-control .icon-next::before { content: "›"; }
@media screen and (min-width: 768px) {
}
.btn-group-vertical > .btn-group::after, .btn-group-vertical > .btn-group::before, .btn-toolbar::after, .btn-toolbar::before, .clearfix::after, .clearfix::before, .container-fluid::after, .container-fluid::before, .container::after, .container::before, .dl-horizontal dd::after, .dl-horizontal dd::before, .form-horizontal .form-group::after, .form-horizontal .form-group::before, .modal-footer::after, .modal-footer::before, .modal-header::after, .modal-header::before, .nav::after, .nav::before, .navbar-collapse::after, .navbar-collapse::before, .navbar-header::after, .navbar-header::before, .navbar::after, .navbar::before, .pager::after, .pager::before, .panel-body::after, .panel-body::before, .row::after, .row::before { display: table; content: " "; }
.btn-group-vertical > .btn-group::after, .btn-toolbar::after, .clearfix::after, .container-fluid::after, .container::after, .dl-horizontal dd::after, .form-horizontal .form-group::after, .modal-footer::after, .modal-header::after, .nav::after, .navbar-collapse::after, .navbar-header::after, .navbar::after, .pager::after, .panel-body::after, .row::after { clear: both; }

@font-face {
	font-family: "Droid Sans";
	font-style: normal;
	font-weight: 400;
	src: local("Droid Sans"), local("DroidSans"), url('../font/droid-sans-v6-latin-regular.eot') format("embedded-opentype"), url('../font/droid-sans-v6-latin-regular.woff2') format("woff2"), url('../font/droid-sans-v6-latin-regular.woff') format("woff"), url('../font/droid-sans-v6-latin-regular.ttf') format("truetype"), url('../font/droid-sans-v6-latin-regular.svg') format("svg");
}
@font-face {
	font-family: "Droid Sans";
	font-style: normal;
	font-weight: 700;
	src: local("Droid Sans Bold"), local("DroidSans-Bold"), url('../font/droid-sans-v6-latin-700.eot') format("embedded-opentype"), url('../font/droid-sans-v6-latin-700.woff2') format("woff2"), url('../font/droid-sans-v6-latin-700.woff') format("woff"), url('../font/droid-sans-v6-latin-700.ttf') format("truetype"), url('../font/droid-sans-v6-latin-700.svg') format("svg");
}
body { background: rgb(201, 201, 201) none repeat scroll 0% 0%; padding: 0px; margin: 0px; line-height: 1.42857; width: 100%; overflow-x: hidden; font-family: "Droid Sans",sans-serif; }
p { text-align: justify; }
#header { color: rgb(255, 255, 255); background-color: #001f3f; border-bottom: 4px solid rgb(173, 173, 173); }
#header .col-md-12 { height: 45px; }
#logo { position: absolute; top: 4px; }
#logo img { margin-top: 0px; margin-left: 15px ! important; }
#welcome { position: absolute; top: 0px; right: 0px; width: 245px; height: 100%; background: rgb(37, 37, 37) none repeat scroll 0% 0%; }
#notif { background: rgb(244, 224, 222) none repeat scroll 0% 0%; width: 100%; }
#notif .col-md-12 { padding-top: 9px; height: 38px; color: rgb(255, 96, 80); }
#loginbox { max-width: 417px; margin: 100px auto 0; background: rgb(255, 255, 255) none repeat scroll 0% 0%; margin: auto; border-radius: 5px; }
#loginfooter { border-top: 1px solid rgb(221, 221, 221); height: 33px; background: rgb(255, 255, 255) none repeat scroll 0% 0%; }
input[type="submit"] { background: #336799 none repeat scroll 0% 0%; color: rgb(255, 255, 255); border: medium none; padding: 10px 15px; width: 100%; }
#logintitle p {
	font-weight: bold;
	padding: 18px 15px;
	font-size: 20px;
	text-align: center;
	color: #336799;
}
#logintitle { height: 60px; background: rgb(241, 241, 241) none repeat scroll 0% 0%; border-top-left-radius: 5px; border-top-right-radius: 5px; color: rgb(37, 37, 37); border: 1px solid rgb(221, 221, 221); }
#welcome { background-color: #001f3f;}
#welcome p { margin: 0px; }
#avatar { float: left; margin-right: 9.5px; }
#avatar img {  }
#selamat {  }
td, th { padding: 5px; }
#ajax { display: none; position: fixed; bottom: 0px; left: 0px; }
.summary-log { background-color: rgb(220, 220, 220); padding: 10px 0px 10px 10px; width: 100%; left: 0px; font-size: 10px; margin-top: 50px; }
footer { background-color: #336799; color: rgb(255, 255, 255); padding-top: 12px; text-align: center; height: 50px; font-size: 12px;  }
footer p {text-align: center; }

/*Menyembunyikan semua blok soal*/
.blok-soal{
   display: none;
}
/*Menyembunyikan soal yang memiliki class active*/
.blok-soal.active{
	display: block;
}
/*Mengatur nomor soal dan huruf pada pilihan agar berbentuk lingkaran*/
.nomor, .huruf{
   display: block;
   width: 35px;
   padding: 5px 0;
   text-align: center;
   border: 1px solid #ccc;
   border-radius: 50%;
   cursor: pointer;
}
/*Mengatur warna background dan teks nomor soal*/
.nomor{
   background: green;
   color: #fff;
}
/*Menyembunyikan input radio*/
input[type=radio]{
   display: none;
}
/*Mengganti warna background huruf ketika input radio dicentang*/
input[type=radio]:checked ~ .huruf{
   background: #336799;
   color: #fff;
}
/*Mengatur tampilan pilihan*/
.pilihan{
   margin-bottom: 20px;
}
.pilihan .teks{
   padding-top: 10px;
}
/*Mengatur konten ujian dan nomor ujian*/
.konten-ujian, .nomor-ujian{
   border: 1px solid #eee;
   padding: 10px;
   height: 100%;	
}
.blok-soal .box{
   height: 400px;
   overflow-y: auto;
   overflow-x: hidden;
}

/*Mengatur lebar tombol nomor soal*/
.blok-nomor{
   width: 20%;
   display: inline-block;
}
.blok-nomor .box{
   padding: 5px;
}

/*Mengatur desain tombol nomor soal*/
.tombol-nomor{
   display: block;
   width: 100%;
   padding: 10px 0;
   text-align: center;
   background: red;
   color: #fff;
   border: 2px solid #000;
   cursor: pointer;
}
/*Mengatur warna tombol nomor soal*/
.tombol-nomor.green{
	background: green;
}
.tombol-nomor.yellow{
	background: yellow;
	color: #000;
}

.heading > a, .heading > small, .heading > .small, .heading > small > a, .heading > .small > a {
	text-decoration: none;
}

.heading > .tombol-kanan {margin-top: -5px; float: right;}
.heading > .tbl-kanan-soal {float: right;}

.heading > .tombol-kanan > .btn-xs {	margin-top: 4px;}