

#wrapper {
    display: none;
}

#banner {
    color: #000;
    padding: 20px;

}

#tagline {
    width: 200px;
    margin-right: 30px;
}

#tagline h1 {
    font-size: 30px;
    font-weight: normal;
    color: #FFF;
    font-family: 'Roboto', sans-serif;
    background: #000;
    padding: 10px;
    width: 280px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    line-height: 1.2;
}

#how-it-works{
    width: 350px;
    float: left;
    margin-right: 20px;
    height: 100%;
    font-family: 'Roboto', sans-serif;
    font-weight: normal;
}

#how-it-works .try-it-now {
    margin: -7px 0 10px;
    font-size: 1.3em; 
}

#banner ol, #banner ul  {
}

#how-it-works .how-it-works-1 {
    background: url(../images/number_1.png) no-repeat 0 50%;
}

#how-it-works .how-it-works-2 {
    background: url(../images/number_2.png) no-repeat 0 50%;
}

#how-it-works .how-it-works-1, #how-it-works .how-it-works-2 {
    padding-left: 35px;
    list-style: none;
    font-size: 1.2em;
    line-height: 1.1;
    margin-bottom: 20px;
}

#banner h2 {
    padding-top: 6px;
    margin-bottom: 10px;
    font-weight: normal;
    font-size: 29px;
    font-family: 'Bubbler One', sans-serif;
}

#tips {
    width: 450px;
    float: left;
    font-family: 'Roboto', sans-serif !important;
}

#container, #left, #middle {
    border: 1px none black;
}

#container {
    margin-top: 2px;
    width: 100%;    
}

#left, #middle, #right {
    float: left;
}

#right {
    margin-left: 3px;   
    background: #fff;
    display: none;
}

#left {
    width: 295px;
    background: #000;
    padding:5px;
    padding-bottom: 0px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 5px;
}


#middle, #right {
    width: 790px;
}

#left .filtering-help {
    float: left;
    margin-right: 10px;
}

#left .filtering-help img {
    
}

#filtering-help-wrapper {
    display: none;
}

#left #quickhelp {
    background: #353535;
    color: #fff;
}

div.question h1 {    
    margin: 0;
    font-family: verdana, arial, helvetica;
    font-size: .9em;
    padding: 1px 5px 0 5px;    
    background: white;
    text-align: left;
    width: 130px;
    height: 1.5em;
    font-weight: bold;
    float: left;
    background: transparent;
}

.click-for-filtering-help {
    text-decoration: underline;
    cursor: pointer;
}

.use {
    float: right;
    display: block;
    width: 60px;
    font-size: .8em;
    border-right: 1px solid gray;
    border-left: 1px solid gray;
    padding-left: 0;
    text-align: left;     
}

.evaluate{
        display: inline;
}

.use-ignore {
    cursor: pointer;
    font-size: .8em;
    display: block;
    background: #ffffff;
    height: 1.5em;
    padding: 3px 4px 0 10px;
    background: url(../images/disable_filter.png) 0 5px no-repeat transparent;
    border-left: 1px none gray;
    float: right;
    margin-right: 5px;
    display: none;
}

.useCrit {
    background: url(../images/enable_filter.png) 0 5px no-repeat transparent;
}


.ignoreCrit {
    background: url(../images/disable_filter.png) 0 5px no-repeat transparent;
}


.clickToFold {
    cursor: pointer;
    font-size: .8em;
    display: block ;
    height: 1.5em;
    padding: 3px 4px 0 15px;
    background: url(../images/close-pane.png) 0 3px no-repeat transparent;
    border-left: 1px none gray;
    float: right;    
}


.openPane {
    background: url(../images/open-pane.png) 0 3px no-repeat;
}

.closePane {
    background: url(../images/close-pane.png) 0 3px no-repeat;
}

.filterUI .questionHeader .help {
    cursor: pointer;
    float: right;
    background: url(../images/help-15x15.png) 0 3px no-repeat;
    width: 16px;
    height: 20px; 
}

/*
div.question {
    font-size: .9em;
    font-family: verdana, arial, helvetica;
    margin-bottom: 5px;    
    border: 1px solid gray;
    background: #b4b8bc;
    text-align: center;    
}
*/


p.question {
    font-size: .9em;
    margin: 0;
    margin-bottom: 5px;
    text-align: left;
}

p.question .hint {
    font-size: smaller;
    display: block;
    
}

div.widget {

}

div.valueWidgetContainer {
    padding-left: 10px;
}

#noscript
{
    padding-bottom: 100px;
    padding-top: 100px;
    margin: 0 auto;
    width: 600px;
}


#questionsTable {
    border-collapse: collapse;
    border: 1px none black;
}

#questionsTable td {
    padding: 5px;
    margin: 5px;
    font-family: verdana, arial;
    font-size: 13px;
    font-weight: normal;
}

#questionsTable tr {
    background-color: #b4b8bc;
}


/* hack for IE */
.whiteLine td { 
    background-color: #b4b8bc; 
    border-bottom: 1px solid #edf5ff;
}
/* End hack for IE */

#finderText {
    color: black;
    padding-left: 50px;
    font-size: 18px;
    padding-top: 0px;
    padding-bottom: 0px;
    white-space: nowrap;
    background: url(../images/cornerTopLeft.png) no-repeat top left #70d25c;
}

#finderText2 {
    background: url(../images/cornerTopRight.png) no-repeat top right #70d25c;
}

#rightPane {
    border: none;
}

.statistics {
    color: black;
    font-size: .9em;
    font-family: Roboto, verdana, arial, helvetica;
    padding: 0;
    height: 1.3em;
    width: 100%;
}

.statistics p.resultSummary {
    font-size: 1.5em;
}

.statistics .display {
    font-size: 1em;
}

.marker {    
    display: block;
    width: 190px;
    float: left;
    border: 1px solid white;    
}

.packageCheckbox {
    display: block;
    float: left;
    margin: 0 2px 0 0;
    width: 15px !important;
    height: 15px !important;
}

.clickedPackage {
    background: #44e07b;
    border-radius: 5px;
}

.packageListItem {
    /*width: 164px;    */
    width: 100%;
    display: block;
    text-decoration: underline;
    color: blue;
    font-size: .8em;
    float: left;
    height: 18px;
    padding: 2px 0 0 2px;
}

#initialHelp div {    
    font-family: arial, verdana, helvetica;
    font-size: 20px;
}

#initialHelp {
    /*background: #b9fdf3;*/
    background: #9affbe;
    width: 60%;
    height: 500px;
    margin-left: 20px;
}

/*
 #right, #middle {
    display: none;
}
*/

#middlePane{
    display: none;
}


#splash {
    /*background: url(../images/search-splash.png) repeat-y #44e07b;*/
    /*min-height: 600px;*/
    margin: 0 auto;
    padding: 0 10px;
    color: #000000;
}

#splash h1 {
    font-size: 1.6em;
    font-weight: normal;
}
 
#splash ul {
    margin-left: 40px;
}

#splash {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 10px;   
}
#output {
    
}

#results {
    margin-bottom: 10px;
    padding-top: 5px;
    margin-top: 5px;
    padding-left: 2px;
 }


#comparisonTable {
    width: 100%;
}

div.filterUI {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    margin-bottom: 5px;
    background: #ccc;
    width: 295px;
    float: left;
    margin-right: 5px;
}

.quickhelp {
    padding: 5px;
    font-size: 14px;
    background: #000;
    color: #ccc;
}


div.questionHeader {
    height: 20px;
    width: 295px;
    height: 1.3em;
}

.filterUI div.question {
    padding: 5px;
    width: 285px;
}

div.questionHeader h1 {    
    font-family: Roboto, verdana, arial, helvetica;
    font-size: .9em;
    padding: 1px 5px 0 5px;    
    background: white;
    text-align: left;
    font-weight: normal;
    float: left;
    background: transparent;
    cursor: pointer;
}

#loading {
    width: 200px;
    margin: 0 auto;
    display: none;
}

.find {
    padding: 2px 0;
    vertical-align: middle;
    padding: 3px;   
}

#evaluateMaxCapitalOutlay-button {
    margin-left: 20px;
    margin-top: 5px;
}

button.find img {
    float: left;
}

div.question p.question {
    display: none;
}

.question input {
    border: 1px solid gray;
    height: 18px;
    padding: 3px;
    margin-left: 10px;
    width: 50px;
}

#has_telkom_line, #monthlyDataUnlimited {
    width: 20px !important;
    margin-bottom: -10px;
    border: none;
}

label.has_telkom_line, label.monthlyDataUnlimited  {
    padding-top: 2px;
    display: inline-block;
    float: left;
    margin-top: 5px;
}

input.has_telkom_line {
    margin-top: 10px;
}

.question select {
    padding: 3px;
    margin-left: 10px;
}

.quickHelp {
    background: white;
    float: left;
    margin-left: 5px;
}

#quick-help {
    float: left;
    width: 286px;
    margin-top: -30px;
    margin-right: 5px;
    margin-left: 10px;
}

#quick-help h1 {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 2px;
}

#quick-help-top {
    background: url(../images/quick-help-top.png) no-repeat;
    height: 8px;
    width: 286px;
}

#quick-help-mid {
    background: url(../images/quick-help.png) repeat-y;
    width: 286px;
    font-size: .9em;
    padding: 0 5px;
}

#quick-help-bottom {
    background: url(../images/quick-help-bottom.png) no-repeat;
    height: 8px;
    width: 286px;
}


.ui-slider-horizontal {
    height: .5em;
    width: 265px;
    margin-left: 10px;
}

.ui-slider .ui-slider-handle {
    width: 1em;
    height: 1em;
    cursor: pointer;
}

.clearFloat {
    clear: both;
    display: block;
}

#package_summary {
    background: #fff;
    padding: 10px;
    float: left;
    max-width: 400px;
}

#package_summary .summary_label {
    font-size: 14px;
    float: left;
    width: 150px;
    text-transform: uppercase;
}

#package_summary .summary_value {
    font-size: 14px;
    float: left;
    display: block;
}

#middlePaneContent {
    background: #fff;
}

/*
#middlePaneContent a.view_details, #middlePaneContent a.download_pdf, #middlePaneContent a.apply_for_package{
    cursor: pointer;
    text-decoration: none;
    color: blue;
    font-size: 12px;
    margin-left: 20px;
    margin-top: 40px;
    display: inline-block;
    line-height: 2;
    border: 1px solid #353535;
    border-radius: 5px;
    padding: 0 5px;
    float: left;
}
*/

#middlePaneContent a.apply_for_package {
    margin-top: 40px;
    -webkit-border-radius: 3px; 
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size:12px;
    font-family:arial, helvetica, sans-serif; 
    padding: 10px 10px 10px 10px; 
    text-decoration:none; 
    display:inline-block;
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3);
    font-weight:bold; 
    color: #FFFFFF;
    border:1px solid #7878ed;
    background-color: #a5a5f3;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#a5a5f3), to(#7a7aeb));
    background-image: -webkit-linear-gradient(top, #a5a5f3, #7a7aeb);
    background-image: -moz-linear-gradient(top, #a5a5f3, #7a7aeb);
    background-image: -ms-linear-gradient(top, #a5a5f3, #7a7aeb);
    background-image: -o-linear-gradient(top, #a5a5f3, #7a7aeb);
    background-image: linear-gradient(to bottom, #a5a5f3, #7a7aeb);
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#a5a5f3, endColorstr=#7a7aeb);
}

#middlePaneContent a.apply_for_package:hover{
    border:1px solid #a0a0f2; 
    background-color: #d2d2f9; 
    background-image: -webkit-gradient(linear, left top, left bottom, from(#d2d2f9), to(#a6a6f2));
    background-image: -webkit-linear-gradient(top, #d2d2f9, #a6a6f2);
    background-image: -moz-linear-gradient(top, #d2d2f9, #a6a6f2);
    background-image: -ms-linear-gradient(top, #d2d2f9, #a6a6f2);
    background-image: -o-linear-gradient(top, #d2d2f9, #a6a6f2);
    background-image: linear-gradient(to bottom, #d2d2f9, #a6a6f2);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#d2d2f9, endColorstr=#a6a6f2);
}

.cb-bg
{
    width: 50px;
    height: 16px;
    background-image: url(../images/cb-bg.gif);
    display: inline-block;
    float: right;
    margin-top: 4px;
    margin-right: 4px;
    cursor: pointer;
}

.cb-slider
{
    width: 24px;
    height: 16px;
    background-image: url(../images/cb-slider.png);
    cursor: pointer;
    position: relative;
}

#resultsPlusNavigationWrapper {
    background: #fff;
}

#resultsWrapper {
    background: #fff;
    max-height: 300px;
}

#resultsNavigationWrapper {
    background: #fff;
    text-align: center;
}

#resultsNavigation {
    clear: both;
}

#paginationInfo * {
    float: left;
    margin: 0 2px;
}

#paginationInfo {
    width: 250px;
    margin: 5px auto;
}

.hiddenResultPage {
    display: none;
}

.currentResultPage {
    display: block;
}

#pagination {
    width:100px;
    margin: 0 auto;
    text-align: center;
}

.pagination {
    float: left;
    cursor: pointer;
    padding: 5px;
    background: #353535;
    border-radius: 5px;
    margin: 0 2px;
    color: #fff;
}

.currentPagination {
    background: #9497c5;
    color: #000;
}

.valueWidgetContainer .min,  .valueWidgetContainer .max {
    font-size: .9em;
    padding-left: 10px;
}

.valueWidgetLabelWrapper {
    display: inline-block;
}

td.comparison_decision {
    text-align: center;
    border: 1px solid #ccc;
    height: 30px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.comparison_winner {
    background-image: url(../images/comparison_winner.png);
}

.comparison_loser {
    background: url(../images/comparison_loser.png);
}

#comparison_decision .label {
    font-size: 1.5em;
    color: green;
    font-weight: bold;
}


/**********HEADER CAROUSEL************/

#tips .image_carousel {
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 3px solid #222;
    padding: 5px;
    background: #3a3a3a;
}

.clearfix {
    float: none;
    clear: both;
}

#carousel_items {
    color: #ccc;
    font-size: 1.5em;
    width: 450px;
    height: 150px;
}

#carousel_items {
    padding-left: 10px;
    padding-top: 10px;
}

#carousel_items li {
    display: block;
    width: 380px;
    height: 150px;
}

/**********END HEADER CAROUSEL************/


#collapseAll {
    margin: 3px 0;
    float: right;
}

.dont-compare {
    background: none;
}

.comparison_criterion {
    float: right;
    width: 15px !important;
    height: 15px !important;
}

.stickToTop {
    position: fixed;
    top: 0;
}

select.unit-selector {
    margin: 0 !important;
    margin-left: -5px !important;
}