/* PRIMARY LAYOUT ELEMENTS   
-----------------------------------------------

-----------*/
body {
    background: #f7f7f7
}

.page {
    width: 970px;
    /* background-color: #grey; /*#4e8b02*/
    /* background:#2F9CD9; */
    margin: 20px auto 0px auto;
    margin: 0px auto 0px auto;
    /* border: 1px #fff; */
    /* border-bottom-color:#fff; */
    padding-top: 8px;
    border-radius: 7px;
}

.header {
    position: relative;
    margin: 0px;
    padding: 0px;
    margin-top: 2px;
    /* background-image:url('http://krepito.net/wp-content/uploads/2015/09/header-lorena3.jpg'); */
    /*background-image: url('http://krepito.net/wp-content/uploads/2015/10/header-lorena-bintangv2.jpg');*/
    background-image: url('images/header-lorena.jpg');
    width: 100%;
    box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */
}

    .header h1 {
        font-weight: 700;
        margin: 0px;
        padding: 0px 0px 0px 20px;
        color: #f9f9f9;
        border: none;
        line-height: 2em;
        font-size: 2em;
    }

.main {
    /*padding: 0px 14px;*/
    padding: 0px 0px;
    /*margin: 12px 8px 8px 8px;*/
    /*margin: top right botoom left*/
    margin: 13px 6px 2px 6px;
    /*Commented by Bona 20140714*/
    min-height: 420px;
    /*min-height: 450px;*/
}

.leftCol {
    padding: 6px 0px;
    margin: 12px 8px 8px 8px;
    width: 200px;
    min-height: 200px;
}

.footer {
    margin: 0px auto 0px auto;
    width: 962px;
    border: 1px;
    padding-top: 0px;
    border-bottom: 1px solid green;
    border-top: 0px solid green;
    border-left: 1px solid green;
    border-right: 1px solid green;
    display: block;
    height: 200px;
    position: relative;
}

.footerSmall {
    /*margin: 0px 0px 0px -5px;*/
    margin: 0px auto 0px auto;
    width: 970px;
    border: 0px;
    padding-top: 0px;
    display: block;
    height: 30px;
    position: relative;
}

    .footerSmall > .text {
        margin: 6px 0px 0px 0px;
        float: left;
        color: #8f8080; /*grey;*/
        font-size: 13px;
        padding-left: 5px;
    }

.bodyContent {
    height: 100%;
    border: 1px;
    border-bottom: 1px solid green;
}

/* LOGO   
-----------------------------------------------

-----------*/
.wrapLogoTitle {
    width: 960px;
    height: 100px;
}

    .wrapLogoTitle .loginDisplay {
        color: #000;
        font-style: bold;
        float: right;
        /* width:414px; */
        width: 550px;
        height: 100%;
        margin-top: 5px;
        padding-top: 5px;
    }

.loginDisplay .clearRow {
    clear: both;
}

.loginDisplay .loginRow {
    width: 100%;
    height: 0px;
}

.loginDisplay .loginRowForm {
    /*height:10px;
   margin-top:40px;
   float:right;*/
    height: 58px;
    margin-top: 10px;
    float: right;
    /*background-color:Red;*/
    /*width:60%;*/
}

.loginRowForm .afterLogin {
    /*float:left;*/
    float: right;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    /*margin-left:30%;*/
    width: 100%;
    padding-top: 5%;
}

.loginDisplay .buttonLogin {
    background-color: #ff8c00; /*darkOrange*/
    font-size: 12px;
    cursor: pointer;
    border: 1px solid #ff8c00;
    color: #ffffff;
    font-size: 12px;
    Width: 48px;
    Height: 20px;
    font-weight: normal;
    margin-left: 5px;
    margin-right: 5px;
    padding-bottom: 6px;
}

.buttonLogin:hover {
    background-color: #AD3A88; /*purple*/
    font-size: 12px;
    cursor: pointer;
    border: 1px solid #AD3A88;
    color: #ffffff;
    font-size: 12px;
    Width: 48px;
    Height: 20px;
    margin-left: 5px;
    margin-right: 5px;
    padding-bottom: 6px;
}

.loginDisplay .languageFlag {
    float: left;
    width: 100px;
    height: 5px;
    /*background-color:Lime;*/
    margin-left: 469px;
}

.loginRowForm .formLogin {
    width: 300px;
}

.formLogin .linkForgotPassword {
    margin-top: -14px;
    margin-left: 43%;
}

/*Added by Donny on 20140610*/
.formLogin .linkRegistration {
    margin-top: -14px;
    /*margin-left:3%;*/
}

.wrapLogoTitle .title {
    float: left;
    text-align: center;
    width: 200px;
    height: 82px;
    font-size: large;
    margin-left: 0px;
    margin-top: 8px;
}

.wrapLogoTitle > .imageLine {
    float: left;
    width: 83px;
    height: 100px;
    position: static;
}

/* TAB MENU   
-----------------------------------------------

-----------*/

div.hideSkiplink {
    /*background-color:#4e8b02; /*green*/
    width: 100%;
    background-image: url(Images/Menu_06.png);
}

img[alt='Skip Navigation Links'] {
    visibility: hidden;
}

div.wrapMenu {
    width: 100%;
    /*background:#00A120;*/
    background: #F6C500;
    height: 32px;
    margin-top: -4px;
    margin-bottom: 20px;
    font-size: 12px !important;
    font-family: serif;
    box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */
}

div.menu {
    /*padding: 4px 0px 4px 8px;*/
    margin-top: 0px !important;
    font-size: 12px !important;
}

    div.menu ul li ul li {
        width: 260px;
    }

    div.menu ul li ul {
        display: none;
    }

    div.menu ul li {
        position: relative;
        float: left;
        list-style: none;
    }

    /*.adjustedZIndex {
    /z-index: 1;
}*/

    div.menu ul {
        list-style: none;
        margin: 0px;
        padding: 0px;
        width: auto;
        font-size: 12px !important;
        height: 32px;
    }

    div.menu li.static {
        height: 33px;
    }

    div.menu ul li a, div.menu ul li a:visited {
        height: 100%;
        /*border:1px solid; /*#4e667d*/
        border-top: 0px solid #ffffff;
        border-left: 0px;
        color: #ffffff; /*#dde4ec*/
        display: block;
        line-height: 1.9em;
        padding: 1px 18px;
        text-decoration: none;
        text-transform: capitalize;
        white-space: nowrap;
        margin-top: -1.4px !important;
        /* background:#00A120; */
        background: rgb(244, 76, 1);
        z-index: 10 !important;
        position: relative;
        margin-top: 10px;
        font-size: 17px !important;
        box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */
        -moz-border-radius: 8px; /* mozilla border radius */
        -moz-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* mozilla box shadow 

*/
    }

    div.menu .level2 {
        margin-top: 0px;
    }

    div.menu ul li a:hover {
        /*background-color: #68bc00; /*#bfcbd6*/
        /*color: #ffffff; #5E9AF0 */
        background: #C92A00; /*#09C;*/
        text-decoration: none;
    }

    div.menu ul li a:active {
        background-color: #06C; /*#465c71*/
        color: #ffffff;
        text-decoration: none;
    }

/* FOOTER CONTENT   
-----------------------------------------------

-----------*/

.footer > .FooterLeft {
    width: 65%;
    border: 1px;
    border-right: 1px green solid;
    height: 100%;
    position: relative;
    padding-left: 10px;
    border-left-style: none;
    border-left-color: inherit;
    border-left-width: 0px;
    border-top-style: none;
    border-top-color: inherit;
    border-top-width: 0px;
    border-bottom-style: none;
    border-bottom-color: inherit;
    border-bottom-width: 0px;
    float: left;
    /*background-color:Aqua;*/
}

.footer > .FooterRight {
    width: 30%;
    height: 100%;
    padding-left: 7px;
    position: relative;
    border-right: 0px none Green;
    border-left-style: none;
    border-left-color: inherit;
    border-left-width: 0px;
    border-top-style: none;
    border-top-color: inherit;
    border-top-width: 0px;
    border-bottom-style: none;
    border-bottom-color: inherit;
    border-bottom-width: 0px;
    float: left;
    /*background-color:Fuchsia;*/
}

/* HOME CONTENT   
-----------------------------------------------

-----------*/
.wrapHome {
    width: 100%;
    height: 100%;
    /*border-bottom:1px solid green;*/
    min-height: 420px;
    margin-top: -7px;
    padding-top: 3px;
}

    /**********************************************

**********/
    .wrapHome > .wrapLeftContent {
        width: 30%;
        height: 100%;
        border: 1px;
        border-bottom: 0px;
        border-left: 0px;
        border-top: 0px;
        border-right: 1px solid green;
        float: left;
        position: relative;
    }

        .wrapHome > .wrapLeftContent > .bookBox {
            width: 100%;
            height: 300px;
            background-color: Black;
            float: left;
        }

        .wrapHome > .wrapLeftContent > .loginBox {
            width: 100%;
            height: 200px;
            background-color: Blue;
            float: left;
        }

    .wrapHome > .wrapRightContent {
        width: 70%;
        height: 100%;
        float: left;
        position: relative;
        background-color: Lime;
    }
    /**********************************************

**********/

    .wrapHome > .bookHomeContent {
        width: 312px;

        /*Modified By Thareq on 20210707*/
        /*height: 336px;*/
        height: 380px;

        /*background-color:Black;*/
        float: left;
        position: relative;
        margin: 0px 6px 0px 0px;
        padding-left: 0px;
        padding-right: 0px;
        margin-top: 1px;
        margin-left: -4px;
        margin-right: 20px;
        /*border:1px solid green;
    /*background-color:#4e8b02; /*green*/
        background: #004935;
        color: #ffffff; /*20130211 Heinda*/
        /*display:none;*/
        box-shadow: -3px -2px 4px rgba(0,0,0,.5); /* w3c box shadow */
    }

    .wrapHome > .advertiseHomeContent {
        /*20130211 heinda commented by heinda*/
        width: 630px;
        height: 312px;
        float: left;
        border: 1px solid grey;
        /*20140213 commented by Donny*/
        /*position:relative;
    width:100%;*/
    }

        /*slideshow*/
        .wrapHome > .advertiseHomeContent > .slider-

        wrapper {
            width: 100%;
            /*20130211 commented by heinda*/
            height: 312px;
            /*20140213 commented by Donny*/
            /*height:100%;*/
        }

    /* HOME CONTENT  3 column
-----------------------------------------------

-----------*/
    .wrapHome > .wrapBoxColumn {
        width: 100%;
        height: 100%;
        margin-top: -15px;
        /*20130211 heinda*/
        /*display:none;*/
    }

        .wrapHome > .wrapBoxColumn > .middleBox1 {
            width: 312px;
            height: 200px;
            float: left;
            position: relative;
            /*border:1px solid grey;
    border-right:1px solid green;
    border-top:0px;
    border-left:0px;
    border-bottom:0px; 
    padding-left:6px;*/
            box-shadow: -3px -2px 4px rgba(0,0,0,.5); /* w3c box shadow */
            background-color: #6F3966;
            margin-left: -2px;
        }

.middleBox1 .middleBox1Title1 {
    width: 100%;
    float: left;
    font-size: 17px;
    font-weight: bold;
    font-family: serif;
    text-align: center;
    border-bottom: 2px solid #ffffff;
    height: 30px;
    padding: 5px;
    z-index: 2;
    /* background-color:#0ca2da; */
    background-color: #6F3966;
    color: #ffffff;
}

.wrapHome > .wrapBoxColumn > .middleBox2 {
    width: 316px;
    height: 200px;
    float: left;
    position: relative;
    /*border:1px solid grey;
    border-right:1px solid green;
    border-top:0px;
    border-left:0px;
    border-bottom:0px;*/
    margin: 0px 0px 0px 10px;
    padding-left: 0px;
    background-color: rgb(246, 197, 0); /*darkorange;*/
    box-shadow: -3px -2px 4px rgba(0,0,0,.5); /* w3c box shadow */
}

.middleBox2 .middleBox2Title2 {
    width: 100%;
    float: left;
    font-size: 17px;
    font-weight: bold;
    font-family: serif;
    text-align: center;
    height: 30px;
    padding: 5px;
    z-index: 2;
    color: White;
    background-color: rgb(246, 197, 0); /*darkorange;*/
    border-bottom: 2px solid #ffffff;
}

.wrapHome > .wrapBoxColumn > .middleBox3 {
    width: 312px;
    height: 200px;
    float: right;
    position: relative;
    padding-left: 0px;
    border: 1px solid grey;
    */ margin:0px 10px 0px 6px;
    background-color: rgb(248, 74, 3);
    color: #ffffff;
    box-shadow: -3px -2px 4px rgba(0,0,0,.5); /* w3c box shadow */
    margin-left: px;
}

.middleBox3 .middleBoxRow1 {
    padding: 0px;
    max-width: 312px;
    min-width: 312px;
    height: 30px;
    float: left;
    padding-bottom: 5px;
}

.middleBoxRow1 .middleBoxRow1Title {
    width: 100%;
    float: left;
    font-size: 17px;
    font-weight: bold;
    font-family: serif;
    text-align: center;
    height: 30px;
    padding: 5px;
    z-index: 2;
    color: #FFFFFF;
    border-bottom: 2px solid #ffffff;
}

.imageBox3Row1 {
    padding-top: 10px;
}

.middleBox3 .middleBoxRow2 {
    clear: both;
    padding-top: 25px;
    max-width: 312px;
    min-width: 312px;
    height: 30px;
    float: left;
    margin-top: 70px;
}


.middleBoxRow2 .middleBoxRow2Title {
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    border-bottom: 1px solid #ffffff;
    height: 30px;
    padding: 5px;
    z-index: 2;
    color: #ffffff;
}

.middleBoxRow2 .contentLinkBerita {
    clear: both;
    margin-top: 5px;
    color: #ffffff;
    font-size: small;
}

.middleBoxRow2 a:link {
    text-decoration: none;
    color: #ffffff;
}

.middleBoxRow2 a:hover {
    text-decoration: none;
    color: #C92A00;
}

.middleBoxRow2 a:visited {
    text-decoration: none;
    color: #00A120; /*#00A120;*/
}

.wrapHome > .middleBox3 > .middleBoxRow3 {
    width: 100%;
    height: 30px;
    float: left;
    background-color: Navy;
}

/* HOME CONTENT  2 column [HEADER TITLE]
-----------------------------------------------

-----------*/
.bookForm .TitleColumn {
    width: 100%;
    float: left;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid #fff;
    height: 30px;
    padding: 0px;
}

.TitleColumn .textTitle {
    color: #ffffff;
    padding: 5px;
    font-family: serif;
    font-size: medium;
}

.bookForm .wrapForm {
    clear: both;
    padding: 5px;
}

/* HOME CONTENT  3 column [HEADER TITLE]
-----------------------------------------------

-----------*/
.wrapHome > .wrapBoxColumn > .middleBox3 >

.middleTitleColumn3 {
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    border-bottom: 1px solid green;
}

/* Form   
-----------------------------------------------

-----------*/

.fontForm {
    font-size: 13px;
}


/* Seat
-----------------------------------------------

-----------------------*/
.busModelName {
    float: left;
    background-color: #C92A00;
    height: 30px;
    width: 100%;
    clear: both;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    padding-top: 3.6px;
    color: #ffffff;
    border-radius: 7px;
}

/*Heinda 20170526*/
legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 21px;
    line-height: inherit;
    color: #717171;
    border: 0;
    border-bottom: 1px solid #e5e5e5;
}


.number {
    /*background: #1abc9c;*/
    background: #ff8c00;
    color: #fff;
    height: 30px;
    width: 30px;
    display: inline-block;
    font-size: 0.8em;
    margin-right: 4px;
    line-height: 30px;
    text-align: center;
    text-shadow: 0 1px 0 rgba(255,255,255,0.2);
    border-radius: 15px 15px 15px 0px;
}

fieldset {
    border: none;
}

.busFloorTitle {
    float: left;
    background-color: #c92a00;
    height: 30px;
    width: 100%;
    clear: both;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    padding-top: 3.6px;
    color: #ffffff;
    border-radius: 7px;
    margin-bottom: 20px;
    margin-top: -35p;
}

/*#container*/ /*commented by heinda change it to class 20170526*/
.container {
    /*border-top: 0px solid #f00;*/
    margin: 0 auto;
    padding: 20px 0 0;
    width: 100%;
    /*width: 650px;*/
    /*background: url('Images/seat/Bus.png') no-repeat;*/
    clear: both;
}

    /*#container .wrap*/ /*commented by heinda change it to class 20170526*/
    .container .wrap {
        float: left;
        /*min-width:300px; 
    max-width:400px; */
        /*max-width:300px;*/
        /*Added by Bona 201405138*/
        max-width: 420px;
        /*background-color:Red;*/
        height: 199px;
        margin-top: 6px;
        padding-top: 7px;
        border-top: 1px solid #000000;
        border-bottom: 1px solid #000000;
    }

.wrap .SeatRight {
    float: left;
    /*border: solid 1px #ff0707;*/
    margin-bottom: 10px;
    /*margin-left:100px;*/
    margin-left: 0px;
}

.SeatRight ul li {
    display: inline;
    /*20130103 heinda
    margin-right:-10px;*/
    /*border: solid 0px #ff0707;*/
    border: solid 0px #ff0707;
}

.SeatRight img {
    border: 0px;
}


.wrap .SeatLeft {
    float: left;
    /*border: solid 1px #ff0707;*/
    /*margin-left:100px;*/
    margin-left: 0px;
}

.SeatLeft ul li {
    display: inline;
    /*20130103 heinda
    margin-right:-10px;*/
    border: solid 0px #ff0707;
}

.SeatLeft img {
    border: 0px;
}

/*
    2017-05-19 added by heinda
    bottom seat
*/

.containerFirstFloor .wrap {
    float: left;
    /*min-width:300px; 
    max-width:400px; */
    /*max-width:300px;*/
    /*Added by Bona 201405138*/
    max-width: 420px;
    /*background-color:Red;*/
    height: 199px;
    margin-top: 6px;
    padding-top: 0px;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
}


.wrap .SeatLeftBottom {
    float: left;
    /*border: solid 1px #ff0707;*/
    /*margin-left:100px;*/
    /*margin-left:40px;*/
}

.SeatLeftBottom ul li {
    display: inline;
    /*20130103 heinda
    margin-right:-10px;*/
    border: solid 0px #ff0707;
}

.SeatLeftBottom img {
    border: 0px;
    margin-left: 30px;
}


.wrap .SeatRightBottom {
    float: left;
    /*border: solid 1px #ff0707;*/
    margin-bottom: 10px;
    /*margin-left:100px;*/
    margin-left: 0px;
}

.SeatRightBottom ul li {
    display: inline;
    /*20130103 heinda
    margin-right:-10px;*/
    /*border: solid 0px #ff0707;*/
    border: solid 0px #ff0707;
}

.SeatRightBottom img {
    border: 0px;
    margin-left: 30px;
}

/**
end of added by heinda
**/

.SeatClear {
    clear: both;
}

/*#container .gridSeat
{
    clear:both;
    float:left;
    min-height:300px;
    max-height:300px;
    width:650px;
    margin-left:-125px;
}

#container .frontSliceBus
{
   float:left;
   width:180px;
   height:280px;
   background: url('Images/seat/front_Slice_Bus.png') no-repeat; 
}

#container .rearSliceBus
{
   float:left;
   width:180px;
   height:280px;
   background: url('Images/seat/rear_Slice_Bus.png') no-repeat; 

}*/

#container .wrapBus {
    margin: 0 auto;
    /*commented by heinda 20170526*/
    height: 200px;
    /*width:auto;*/
    /*width:100%;*/
    /*max-width:535px;*/
    /*Added by Bona 20140513*/
    max-width: 700px;
    /*Added by heinda 20170526*/
    /*clear: both;*/
}

/*20150526 added by heinda*/
/*.containerFirstFloor
{
    max-width:700px;
}

#containerFirstFloor .wrapBusBottom
{
    float: left;
    max-width: 420px;
    height: 199px;
    margin-top: 6px;
    padding-top: 0px;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
}*/


.gridSeat {
    clear: both;
    float: left;
    min-height: 300px;
    max-height: 300px;
    width: 100%;
    /*max-width:650px;*/
    /*margin-left:-125px;*/
}

.seatDescription {
    float: left;
    width: 180px;
    /*commented by heinda 20170526
   height:280px;*/
    background: url('Images/seat/Seat_Description.png') no-repeat;
    /*margin-left:70px;
   margin-left:20%;
   margin-left:-20px;*/
    min-height: 180px;
}


.wrapBus .frontSliceBus {
    float: left;
    width: 180px;
    height: 280px;
    background: url('Images/seat/front_Slice_Bus.png') no-repeat;
    /*margin-left:70px;
   margin-left:20%;*/
}

.wrapBus .rearSliceBus {
    float: left;
    width: 55px;
    height: 280px;
    background: url('Images/seat/rear_Slice_Bus.png') no-repeat;
}

/***
added by heinda 2017-05-19
***/
.wrapBusBottom .frontSliceBus {
    float: left;
    width: 180px;
    height: 280px;
    background: url('Images/seat/front_Slice_Bus.png') no-repeat;
    /*margin-left:70px;
   margin-left:20%;*/
}

.wrapBusBottom .rearSliceBus {
    float: left;
    width: 55px;
    height: 280px;
    background: url('Images/seat/rear_Slice_Bus.png') no-repeat;
}

/* Seat
-----------------------------------------------

-----------------------*/

.bookHomeContent .bookForm {
    float: left;
    max-width: 314px;
    min-width: 314px;
    max-height: 314px;
    min-height: 314px;
    padding-left: 0px;
}

.bookForm .formRow {
    max-width: 373px;
    min-width: 373px;
    max-height: 30px;
    min-height: 30px;
    /*background-color:Aqua;*/
    float: left;
    width: 297px;
}

.bookForm .bookClear {
    float: left;
    clear: both;
    /*Modified By Thareq on 20210707*/
    /*max-height: 1px;
    min-height: 1px;*/
    max-height: 40px;
    min-height: 40px;

    max-width: 100%;
    min-width: 100%;
}

.lkComponentPadding {
    /*padding:5px;*/
    margin-top: 3px;
    font-size: 12px;
}

.buttonCariStyle {
    background-color: #ff8c00;
    font-size: 17px;
    cursor: pointer;
    border: 1px solid #ff8c00;
    /*margin-left:105px;*/
    float: left;
    color: #ffffff;
    font-size: large;
    Width: 100px;
    Height: 30px;
    margin-left: 32.5%;
}

.buttonCariStyleHome {
    background-color: #ff8c00;
    font-size: 17px;
    cursor: pointer;
    border: 1px solid #ff8c00;
    margin-left: 105px;
    /*float:right;*/
    color: #ffffff;
    font-size: large;
    Width: 100px;
    Height: 30px;
}


.buttonCariStyle:hover {
    background-color: #D54DA9;
    border: 1px solid #D54DA9;
}

.boxClear {
    float: left;
    clear: both;
    max-height: 6px;
    min-height: 20px;
    max-width: 100%;
    min-width: 100%;
}

.footerClear {
    clear: both;
    height: 5px;
    border: 1px;
}


/*Sepri
-----------------------------------------------

-----------------------*/
.lbl_HeaderPage {
    font-weight: bold;
    font-size: large;
    /*20121214
    color:Red;*/
    color: #ffffff;
    text-align: center;
    font-family: Arial;
    margin-bottom: 10px;
}

.login_MainContent {
    text-align: center;
    margin-top: 10px;
    /*height:100%;
    background-color:#C92A00;
    color:#ffffff;
    min-height:100px;*/
}

.login_Border {
    background-color: #AD3A88;
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    border: 1px solid #ffffff;
}

    .login_Border .loginTitle {
        border-bottom: 1px solid #ffffff;
        font-size: larger;
        font-weight: bold;
    }

.login_marginTop {
    margin-top: 10px;
}

.loginLabel {
    Width: 175px;
    Font-Size: Small;
    text-align: left;
    display: inline-block;
    color: #ffffff;
}

.loginRfv {
    Width: 180px;
    Font-Size: Small;
    text-align: right;
    display: inline-block;
    color: Red;
}

.loginTextbox {
    width: 180px;
    display: inline-block;
}

.LookUpTextbox {
    width: 180px;
    display: inline-block;
}

.loginHyperlink {
    Font-Size: Small;
    color: Blue;
    font-weight: Bold;
}

.registrasiBorderFirstBox {
    margin-right: auto;
    margin-left: auto;
    width: 650px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: #C92A00;
}

.registrasiBorderSecondBox {
    margin-right: auto;
    margin-left: auto;
    width: 650px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: darkOrange;
}

.registrasiBorderThirdBox {
    margin-right: auto;
    margin-left: auto;
    width: 650px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: #AD3A88;
}

.registrasiLabel {
    Width: 220px;
    Font-Size: Small;
    text-align: right;
    display: inline-block;
}

.registrasiLabelcenter {
    Width: 200px;
    Font-Size: Small;
    text-align: center;
    display: inline-block;
}

.registrasi_lbltxt {
    margin-left: 100px;
    /*text-align: center;        */
    margin-top: 5px;
    margin-bottom: 5px;
}

.registrasi_center {
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
}

.registrasiHeaderGroup {
    font-weight: bold;
    font-size: 15px;
    /*20121214
    color:Red;*/
    color: #ffffff;
    text-align: center;
    font-family: Arial;
    margin-top: 5px;
    margin-bottom: 5px;
    border-bottom: 2px solid #ffffff;
}

.registrasiHeaderGroupText {
    padding-left: 5px;
}

.registrasiRfv {
    text-align: right;
    color: Red;
    font-size: small;
    display: inline-block;
}

.registrasiSex {
    text-align: center;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 100px;
    margin-right: 100px;
}

.registrasi_lbltxtPengaduan {
    /*margin-left:100px;*/
    /*text-align: center;        */
    margin-top: 5px;
    margin-bottom: 5px;
}


.headerTitle {
    text-align: left;
    font-weight: bold;
    font-Size: large;
    color: #C64432;
    font-family: Arial;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.subheaderTitle {
    text-align: left;
    font-weight: bold;
    font-Size: medium;
    color: #DA9518;
    font-family: Arial;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.contentMain {
    font-weight: bold;
}

.content {
    text-align: justify;
    font-weight: normal;
    font-Size: small;
    /*color:#DA9518;*/
    color: Black;
    font-family: Arial;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 10px;
    margin-right: 10px;
}

.padCaraPembayaranTiket {
    margin-top: 5px;
    margin-bottom: 5px;
}

.divTable {
    display: table;
    width: auto;
    clear: both;
    margin-bottom: 10px;
    /*background-color:#eee;
        border:1px solid  #666666;
        border-spacing:5px;
        cellspacing:poor IE support for  this*/
    /* border-collapse:separate;*/
}

.divRow {
    display: table-row;
    width: auto;
}

.divCell {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 900px;
    /*background-color:#ccc;*/
}

.divCellNumber {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 20px;
    /*background-color:#ccc;*/
}

.divSplitCellImage {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 210px;
    /*background-color:#ccc;*/
}

.divSplitCellText {
    float: left; /*fix for  buggy browsers*/
    display: table-column;
    width: 600px;
    /*background-color:#ccc;*/
}

.SyaratolStyle {
    text-align: justify;
    font-family: Arial;
    font-size: small;
    clear: both;
    vertical-align: top;
    /*Added by Donny on 20140424*/
    /*display:list-item;*/
}

    /*Added by Donny on 20140424*/
    .SyaratolStyle li {
        list-style-type: decimal;
        margin-left: 30px;
        margin-bottom: 10px;
    }

.CallCenter {
    margin-right: auto;
    margin-left: auto;
    width: 900px;
    /*border-style: solid;*/
    margin-top: 5px;
}

.CallCenterListHeader {
    font-weight: bold;
    font-size: small;
    color: black;
    text-align: left;
    font-family: Arial;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 5px;
}

.listyle {
    margin-top: 10px;
}

.pTrajectForm .wrapPaddFormSPJ {
    padding-left: 5px;
    padding-right: 5px;
    width: 50%;
    /*float:left;*/
    margin: 0 auto;
}

.pTrajectForm .searchButtonPositionSPJ {
    float: left;
    width: 100%;
    clear: both;
    /*padding-right:10px;*/
    padding-top: 10px;
}

.pTrajectForm .wrapPaddFormSPJButton {
    padding-left: 5px;
    padding-right: 5px;
    width: 15%;
    float: left;
}

.textFieldLabelEien {
    float: right;
}

.textFieldEien {
    float: left;
    width: 50px;
}

.textFieldNextEien {
    float: left;
    width: 20%;
}

.buttonLookUpEien {
    float: left;
    width: 50px;
}

.buttonLookUpTicketEien {
    float: left;
    width: 58px;
}

.buttonLookUpTravel {
    float: left;
    width: 100px;
}

.buttonPosition {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 110px;
    font-size: 12px;
    font-weight: bold;
}

.buttonSPJ {
    float: left;
    margin-left: 10px;
    width: 100px;
    height: 30px;
}

.buttonDP {
    float: left;
    margin-left: 10px;
    width: 100px;
    height: 30px;
}

.spanColumnsStyleSPJ {
    padding-left: 5px;
}



/*Heinda
-----------------------------------------------

-----------------------*/

.pTrajectClear {
    clear: both;
}

.pTrajectTitle {
    font-weight: bold;
    font-size: large;
    color: Red;
    text-align: center;
    font-family: Arial;
    margin-top: 10px;
}

.pTrajectWrapLeft {
    /* width: 312px; */
    width: 100%;
    /*height:100%;*/
    /*height:180px;*/
    height: auto;
    float: left;
    position: relative;
    margin: 0px 6px 0px 0px;
    padding-left: 0px;
    padding-right: 0px;
    /*border:1px solid green;
   /*background-color:#4e8b02; /*green*/
    /*background:#C92A00;*/
    /*color:#ffffff;*/
    color: Black;
    /*clear:both;*/
}

    .pTrajectWrapLeft .pTrajectForm {
        /*width:312px;*/
        width: 970px;
        /*height:250px;*/
        /*background-color:Black;*/
        float: left;
        position: relative;
        margin: 0px 6px 0px -5px;
        padding-left: 0px;
        padding-right: 0px;
        /*border:1px solid green;
    /*background-color:#4e8b02; /*green*/
        color: #ffffff;
        /*padding-left:5px;
    padding-right:5px;*/
        background: #C92A00;
    }

.pTrajectForm .wrapPaddForm {
    padding-left: 5px;
    padding-right: 5px;
    width: 50%;
    float: left;
}

.pTrajectForm .searchButtonPosition {
    float: left;
    width: 100%;
    clear: both;
    padding-right: 10px;
}

.pTrajectForm .TitleColumn {
    clear: both;
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    border-bottom: 1px solid #fff;
    height: 30px;
    padding: 0px;
}

.pTrajectForm .pTrajectTitle {
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    padding-bottom: 25px;
    padding-top: 5px;
    border-bottom: 1px solid #fff;
    height: 20px;
    /*padding:5px;*/
    color: #ffffff;
    margin-top: 0px;
    margin-bottom: 10px;
    text-align: left;
}

.pTrajectForm .formClear {
    float: left;
    clear: both;
    max-height: 3px;
    min-height: 3px;
    max-width: 100%;
    min-width: 100%;
}

.pTrajectForm .titleLabelPosition {
    margin-left: 0px;
}

.pTrajectPergi {
    /*clear:both;*/
    margin-right: auto;
    /*margin-left: auto;*/
    margin-left: -5px;
    /*width: 630px; */
    width: 100%;
    /*border-style: solid;*/
    margin-top: 0px;
    float: left;
    height: 100%;
    /*height:230px;
    /*background-color:darkOrange;    */
}

    .pTrajectPergi .pTrajectBoxTraject {
        /*margin: 6px 0px 6px -5px;*/
        margin: 6px 0px 6px 0px;
        background-color: #AD3A88; /*Commented by Bona 20140701*/
        /*max-height:20px;*/
        max-height: 20px;
        min-height: 20px;
        font-size: larger;
        font-weight: bold;
        color: #ffffff;
        padding-left: 5px;
        clear: both;
        width: 970px;
    }

.pTrajectBoxTraject .titleTrajectSelection {
    width: 100%;
    text-align: left;
}

.pTrajectPergi .pTrajectBusNameBox {
    clear: both;
    background-color: Blue;
    float: left;
    max-width: 100px;
    min-width: 100px;
    max-height: 200px;
    min-height: 200px;
    margin: 0px 6px 0px 0px;
}

.pTrajectPergi .pTrajectRouteList {
    /*background-color:Fuchsia;*/
    float: left;
    /*max-width:625px;
    min-width:625px;*/
    width: 100%;
    max-height: 100%;
    min-height: 100%;
}

.x-panel x-grid-with-row-lines x-panel-default

x-grid {
    height: 100%;
    float: left;
}

.pTrajectPergi .warningTime {
    clear: both;
    float: left;
    width: 100%;
    height: 15px;
}

/*#MainContent_grdTraject
{
    height:100%;
}*/

#MainContent_grdTraject {
    /*height:100% !important;
             min-height:71px;*/
    max-height: 100% !important;
}

.ptrajectPulang {
    /*clear:both;*/
    margin-right: auto;
    margin-left: auto;
    width: 550px;
    border-style: solid;
    margin-top: 5px;
    float: left;
}

/*hr style*/
.bookForm .styleLine {
    clear: both;
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient (left, rgba(0,0,0,0), #ffffff, rgba(0,0,0,0));
    background-image: -moz-linear-gradient (left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba

(0,0,0,0));
    background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba (0,0,0,0));
    background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba (0,0,0,0));
    /*height:1px;
    width:100%;
    background-color:#ffffff;*/
}

.bookForm .TitleColumnKembali {
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    border-bottom: 1px solid #fff;
    height: 5px;
    padding: 0px;
}

.pTrajectForm .paddingStyleLine {
    clear: both;
    padding-bottom: 5px;
}

.pTrajectForm .styleLineTrajectSelection {
    /*clear:both;
    border: 0;
    height: 1px;
    background-image: -webkit-linear-gradient

(left, rgba(0,0,0,0), #ffffff, rgba(0,0,0,0)); 
    background-image: -moz-linear-gradient

(left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba

(0,0,0,0)); 
    background-image: -ms-linear-gradient(left, 

rgba(0,0,0,0), rgba(0,0,0,0.75), rgba

(0,0,0,0)); 
    background-image: -o-linear-gradient(left, 

rgba(0,0,0,0), rgba(0,0,0,0.75), rgba

(0,0,0,0)); */
    height: 1px;
    width: 100%;
    background-color: #ffffff;
}

.pTrajectTitle .textTitle {
    color: #ffffff;
    padding-left: 5px;
    text-align: center;
}

.buttonCariStyleTrajectSelection {
    background-color: #ff8c00;
    font-size: 17px;
    cursor: pointer;
    border: 1px solid #ff8c00;
    margin-left: 0px;
    color: #ffffff;
    font-size: large;
    Width: 100px;
    Height: 30px;
}

    .buttonCariStyleTrajectSelection:hover {
        background-color: #D54DA9;
        border: 1px solid #D54DA9;
    }

.titleTrajectPageSeatReservation {
    clear: both;
    background-color: #AD3A88;
    width: 100%;
    height: 27px;
    color: #ffffff;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    padding-top: 2px;
    margin-bottom: 3px;
}

/* Page SPJ */

.pTrajectSPJWrapLeft {
    /*width: 312px;*/
    width: 100%;
    /*height:100%;*/
    height: 180px;
    float: left;
    position: relative;
    margin: 0px 6px 0px 0px;
    padding-left: 0px;
    padding-right: 0px;
    /*border:1px solid green;
   /*background-color:#4e8b02; /*green*/
    /*background:#C92A00;*/
    color: #ffffff;
    /*clear:both;*/
}

    .pTrajectSPJWrapLeft .pTrajectSPJForm {
        /*width:312px;*/
        width: 948px;
        height: 180px;
        /*background-color:Black;*/
        float: left;
        position: relative;
        margin: 0px 6px 0px 0px;
        padding-left: 0px;
        padding-right: 0px;
        /*border:1px solid green;
    /*background-color:#4e8b02; /*green*/
        background: #C92A00;
        color: #ffffff;
        /*padding-left:5px;
    padding-right:5px;*/
        background: #C92A00;
    }

.pTrajectSPJForm .wrapPaddForm {
    padding-left: 5px;
    padding-right: 5px;
    width: 50%;
    float: left;
}

.pTrajectSPJForm .searchButtonPosition {
    float: left;
    width: 100%;
    clear: both;
    padding-right: 10px;
}

.pTrajectSPJForm .TitleColumn {
    clear: both;
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    border-bottom: 1px solid #fff;
    height: 30px;
    padding: 0px;
}

.pTrajectSPJForm .pTrajectSPJTitle {
    width: 100%;
    float: left;
    font-size: large;
    font-weight: bold;
    padding-bottom: 25px;
    padding-top: 5px;
    border-bottom: 1px solid #fff;
    height: 20px;
    /*padding:5px;*/
    color: #ffffff;
    margin-top: 0px;
    margin-bottom: 10px;
    text-align: left;
}

.pTrajectSPJForm .formClear {
    float: left;
    clear: both;
    max-height: 3px;
    min-height: 3px;
    max-width: 100%;
    min-width: 100%;
}

.pTrajectSPJForm .titleLabelPosition {
    margin-left: 0px;
}

.main .pTrajectWrap {
    clear: both;
}

/*.pTrajectWrap .pTravelPassenger*/
.pTrajectWrapLeft .pTravelPassenger {
    clear: both;
    margin-right: auto;
    margin-left: auto;
    /*width: 630px; */
    width: 100%;
    /*border-style: solid;*/
    margin-top: 0px;
    float: left;
    height: 100%;
    /*height:230px;
    /*background-color:darkOrange;    */
}

.pTravelPassenger .pTravelPassengerBox {
    margin: 6px 0px 6px 0px;
    background-color: #AD3A88;
    max-height: 20px;
    min-height: 20px;
    font-size: larger;
    font-weight: bold;
    color: #ffffff;
    padding-left: 5px;
    clear: both;
    width: 100%;
}

.pTravelPassengerBox .titleTrajectSelection {
    width: 100%;
    text-align: left;
}


.pTravelPassenger .pTravelPassengerGrid {
    clear: both;
    color: Black;
}

.pTravelPassengerGrid .styleGrid {
    height: 100%;
}

/*gridPanel Style*/

.x-grid-custom .x-grid3-scroller {
    overflow: scroll;
}

.styleGrid {
    height: 100%;
}

.x-grid-custom {
    width: 100%;
}

    .x-grid-custom .x-column-header {
        background: darkOrange url() repeat scroll 0 bottom;
        font: 12px/16px "segoe ui",arial,sans-serif;
        height: 22px;
        font-weight: bold;
        text-align: left;
        border-left-color: #ffffff;
        border-right-color: #ffffff;
    }

    .x-grid-custom .x-panel-header-default {
        border: 1px solid rgb(153, 188, 232);
        font-size: 11px;
        /*background-color: rgb(203, 221, 243);
    background-image: linear-gradient(center 

top , darkOrange, 
    darkOrange 45%, darkOrange 46%, darkOrange 

50%, 
    darkOrange 51%, darkOrange);
    background-image: -webkit-linear-gradient

(center top , darkOrange, 
    darkOrange 45%, darkOrange 46%, darkOrange 

50%, 
    darkOrange 51%, darkOrange);
    background-image: -moz-linear-gradient

(center top , darkOrange, 
    darkOrange 45%, darkOrange 46%, darkOrange 

50%, 
    darkOrange 51%, darkOrange);*/
        background-color: darkOrange;
        background-image: -moz-linear-gradient (center top , darkOrange, darkOrange 45%, 
    darkOrange 46%, darkOrange 50%, darkOrange 

51%, darkOrange);
        background-image: -webkit-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
        background-image: -webkit-linear-gradient (top, darkOrange, darkOrange 45%, darkOrange 

46%, 
        darkOrange 50%, darkOrange 51%, 

darkOrange);
        background-image: -o-linear-gradient(center top, #AD3A88, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        background-image: -ms-linear-gradient (center top , darkOrange, 
        darkOrange 45%, darkOrange 46%, 

darkOrange 50%, 
        darkOrange 51%, darkOrange);
        background-image: linear-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f04', endColorstr='#ff7f04',GradientType=1 );
        background-image: -ms-linear-gradient(top, darkOrange, darkOrange); /* IE10 */
    }

    .x-grid-custom .x-column-header div {
        background-color: darkOrange !important;
        color: #ffffff;
    }

    .x-grid-custom .x-column-header-over {
        background: #AD3A88 url() repeat 0 bottom !important;
    }

    .x-grid-custom .x-column-header div {
        color: #ffffff;
    }

    .x-grid-custom .x-panel-header-text-default {
        color: #ffffff;
        font-size: 11px;
        font-weight: bold;
        font-family: tahoma,arial,verdana,sans- serif;
        line-height: 17px;
    }

    .x-grid-custom .x-grid-row-over .x-grid-cell {
        border-color: #ffffff;
        background: #C92A00;
        color: #ffffff;
    }

    .x-grid-custom .x-grid-row-selected .x-

    grid-cell {
        background: url() repeat-x scroll 0 0 #AD3A88;
        border-color: #ffffff;
        border-style: solid;
    }

    .x-grid-custom .x-grid-row-selected TD,
    .x-grid-custom .x-grid-row-selected TD

    .company-link {
        background-color: #AD3A88 !important;
        color: #ffffff;
    }

    .x-grid-custom .spanColumnsStyle {
        padding-left: 5px;
    }

    .x-grid-custom .x-toolbar-default {
        background-color: darkOrange !important;
        border-color: darkOrange !important;
        background-image: -moz-linear-gradient (center top , darkOrange, darkOrange) !important;
        background-image: -webkit-gradient (linear,50% 0,50% 100%,color-stop

(0%,darkOrange),color-stop(100%,darkOrange)) !important;
        background-image: -webkit-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -moz-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -o-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -ms-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: linear-gradient (top,darkOrange,darkOrange) !important;
    }

.x-border-box, .x-border-box * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5,
h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
    margin: 0;
    padding: 0
}

.x-body {
    color: black;
    font-size: 12px;
    font-family: tahoma,arial,verdana,sans-serif
}

/*heinda Ext.Net MessageBox text align*/
.MessageBoxcenterText {
    text-align: justify !important;
}

/*branch style for main, header, menu heinda 

201212.11.48*/
.branchHeader {
    position: fixed;
    margin: 0px;
    padding: 0px;
    background: #00A120;
    width: 960px;
    z-index: 10000;
}


div.branchWrapMenu {
    width: 960px;
    background: darkOrange;
    height: 32px;
    margin-top: 80px;
    font-size: 12px !important;
    position: fixed;
    z-index: 10000;
}

.branchMain {
    padding: 0px 0px;
    margin: 120px 6px 2px 6px;
    /*margin: 13px 6px 2px 6px;*/
    min-height: 420px;
}

.branchTrajectForm .branchPTrajectTitle {
    /*.branchPTrajectTitle {*/
    /*width: 100%;*/
    width: 948px;
    float: left;
    font-size: large;
    font-weight: bold;
    padding-bottom: 25px;
    /*padding-top: 5px;*/
    padding-top: 0px;
    border-bottom: 1px solid white;
    border-top: 1px solid white;
    height: 20px;
    color: white;
    margin-top: 0px;
    margin-bottom: 10px;
    text-align: center;
    position: fixed;
    z-index: 2;
    /*background-color:#C92A00;*/
    background-color: rgb(173, 58, 136);
}

.pTrajectForm .branchWrapPaddFormSPJ {
    padding-left: 5px;
    padding-right: 5px;
    width: 50%;
    margin: 0 auto;
    margin-top: 50px;
    padding-top: 25px;
}

.branchPTrajectTitle .branchTextTitle {
    color: #ffffff;
    padding-left: 5px;
    text-align: center;
}

.multilineColumn {
    text-align: left !important;
    font-weight: bold;
}

/*.disableTextFieldEien*/
input[readonly] {
    background: #CCC;
    color: #333;
    border: 1px solid #666
}
/*{
    float: left;
    width: 50px;
    background-color:Gray !important;
}*/

/*individual Page style*/
.userRegistrationPage {
    /*background-color:#AD3A88; */
    color: #ffffff;
    min-height: 415px;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

    .userRegistrationPage .userRegistrationTitle {
        text-align: center;
        margin-top: 10px;
        height: 23px;
        background-color: #AD3A88;
        color: #ffffff;
        box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */
    }

.userLoginPage {
    /*background-color:#00A120; */
    color: #ffffff;
    text-align: center;
    min-height: 420px;
}

    .userLoginPage .wrapLoginForm {
        margin-left: auto;
        margin-right: auto;
        margin-top: auto;
        width: 400px;
    }

.wrapComplain {
    background-color: rgb(255,140,0);
    min-height: 415px;
    color: White;
}

/*Branch Style two columns*/
.branchTrajectForm .branchWrap {
    /*padding-left: 5px;
    padding-right: 5px;
    /*width: 50%;
    margin: 0 auto;*/
    margin-top: 35px;
    /*padding-top: 25px;
    background-color:White;*/
}

.branchWrap .branchWrapLeft {
    /*padding:5px 5px 5px 5px;
    background-color:Aqua;*/
    float: left;
    width: 40%;
}

.branchWrap .branchWrapRight {
    /*padding:5px 5px 5px 5px;
    background-color:Lime;*/
    margin-left: 10.5%;
    width: 40%;
    float: left;
}

.branchTrajectWrapLeft {
    width: 100%;
    height: auto;
    float: left;
    position: relative;
    margin: 0px 6px 0px 0px;
    padding-left: 0px;
    padding-right: 0px;
    color: Black;
}

    .branchTrajectWrapLeft .branchTrajectForm {
        /*width:312px;*/
        width: 948px;
        /*height:180px;*/
        /*background-color:Black;*/
        float: left;
        position: relative;
        margin: 0px 6px 0px 0px;
        padding-left: 0px;
        padding-right: 0px;
        /*border:1px solid green;
    /*background-color:#4e8b02; /*green*/
        color: #ffffff;
        /*padding-left:5px;
    padding-right:5px;
    background:#C92A00;*/
    }



.branchTravelPassenger

.branchTravelPassengerBox {
    margin: 6px 0px 6px 0px;
    /*background-color:#AD3A88;*/
    max-height: 6px;
    min-height: 6px;
    font-size: larger;
    font-weight: bold;
    color: #ffffff;
    padding-left: 5px;
    clear: both;
    width: 100%;
}

.branchTrajectForm .buttonPosition {
    clear: both;
    padding-top: 10px;
    padding-bottom: 20px;
    padding-left: 40%;
    font-size: 12px;
    font-weight: bold;
    margin: 0 auto;
}

.buttonPosition .buttonObject {
    float: left;
    margin-left: 5px;
    width: 60px;
    height: 30px;
}

.buttonPosition .buttonObjectBottom {
    float: left;
    margin-left: 40%;
    width: 60px;
    height: 30px;
}


.branchTrajectForm .paddingTopBar {
    height: 6px;
}

/*SPJ page only*/
.branchTrajectForm .buttonPositionSPJ {
    clear: both;
    padding-top: 10px;
    padding-bottom: 20px;
    padding-left: 40%;
    font-size: 12px;
    font-weight: bold;
    margin: 0 auto;
    /*margin-top:10px;
    margin-left:450px;*/
}

.buttonPositionSPJ .buttonObject {
    float: left;
    margin-left: 5px;
    width: 100px;
    height: 30px;
}

.buttonPositionSPJ .buttonObjectPrint {
    float: left;
    margin-left: 5px;
    width: 100px;
    height: 30px;
}

/*Custom Form*/
.x-custom-Left-form .x-panel-header-default {
    border: 1px solid white;
    font-size: 11px;
    background-color: darkOrange;
    /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    background-image: -moz-linear-gradient (center top , darkOrange, darkOrange 45%, 
        darkOrange 46%, darkOrange 50%, 

darkOrange 51%, darkOrange);
    background-image: -webkit-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    background-image: -webkit-linear-gradient (top, darkOrange, darkOrange 45%, darkOrange 

46%, 
        darkOrange 50%, darkOrange 51%, 

darkOrange);
    background-image: -o-linear-gradient(center top, #AD3A88, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    background-image: -ms-linear-gradient (center top , darkOrange, 
        darkOrange 45%, darkOrange 46%, 

darkOrange 50%, 
        darkOrange 51%, darkOrange);
    background-image: linear-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f04', endColorstr='#ff7f04',GradientType=1 );
    background-image: -ms-linear-gradient(top, darkOrange, darkOrange); /* IE10 */
    color: White;
    margin-top: 6px;
}

.x-custom-Left-form-Second .x-panel-header-

default {
    border-left: 1px solid white !important;
    border-right: 1px solid white !important;
    border-top: 1px solid white !important;
    font-size: 11px;
    border-bottom: 1px solid #ffffff;
    background-color: darkOrange;
    /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    /*background-image: -webkit-linear-gradient

(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    background-image: -moz-linear-gradient (center top , darkOrange, darkOrange 45%, 
        darkOrange 46%, darkOrange 50%, 

darkOrange 51%, darkOrange);
    background-image: -webkit-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
    background-image: -webkit-linear-gradient (top, darkOrange, darkOrange 45%, darkOrange 

46%, 
        darkOrange 50%, darkOrange 51%, 

darkOrange);
    background-image: -o-linear-gradient(center top, #AD3A88, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    background-image: -ms-linear-gradient (center top , darkOrange, 
        darkOrange 45%, darkOrange 46%, 

darkOrange 50%, 
        darkOrange 51%, darkOrange);
    background-image: linear-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f04', endColorstr='#ff7f04',GradientType=1 );
    background-image: -ms-linear-gradient(top, darkOrange, darkOrange); /* IE10 */
    color: White;
    margin-top: 6px;
}

.x-custom-Left-form .x-panel-header-text-

default {
    color: white;
    font-size: 11px;
    font-weight: bold;
    font-family: tahoma,arial,verdana,sans- serif;
    line-height: 17px;
}

.x-custom-Left-form .x-panel-body-default {
    background: none repeat scroll 0% 0% darkOrange;
    /*border-color: rgb(153, 188, 232);*/
    color: white;
    border-width: 1px !important;
    border-style: solid;
    border-color: #ffffff !important;
}

.x-custom-Right-form .x-panel-header-default {
    border: 1px solid white;
    font-size: 11px;
    background-color: #C92A00;
    margin-top: 6px;
    /*background-image: -webkit-linear-

gradient(center top , #C92A00, 
        #C92A00 45%, #C92A00 46%, #C92A00 50%, 
        #C92A00 51%, #C92A00);*/
    background-image: -moz-linear-gradient (center top , #C92A00, 
        #C92A00 45%, #C92A00 46%, #C92A00 50%, 
        #C92A00 51%, #C92A00);
    background-image: -webkit-gradient(center top, #C92A00, #C92A00 45%, #C92A00 46%, #C92A00 50%, #C92A00 51%, #C92A00);
    /*background-image: -webkit-linear-

gradient(center top , #C92A00, 
        #C92A00 45%, #C92A00 46%, #C92A00 50%, 
        #C92A00 51%, #C92A00);*/
    background-image: -webkit-linear-gradient (top, #C92A00, #C92A00 45%, #C92A00 46%, 
        #C92A00 50%, #C92A00 51%, #C92A00);
    background-image: -o-linear-gradient(center top, #C92A00, #C92A00 45%, #C92A00 46%, #C92A00 50%, #C92A00 51%, #C92A00);
    background-image: -ms-linear-gradient (center top , #C92A00, 
        #C92A00 45%, #C92A00 46%, #C92A00 50%, 
        #C92A00 51%, #C92A00);
    background-image: linear-gradient(center top, #C92A00, #C92A00 45%, #C92A00 46%, #C92A00 50%, #C92A00 51%, #C92A00);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C92A00', endColorstr='#C92A00',GradientType=1 );
    background-image: -ms-linear-gradient(top, #C92A00, #C92A00); /* IE10 */
    margin-top: 6px;
}

.x-custom-Right-form .x-panel-header-text-

default {
    color: white;
    font-size: 11px;
    font-weight: bold;
    font-family: tahoma,arial,verdana,sans- serif;
    line-height: 17px;
}

.x-custom-Right-form .x-panel-body-default {
    background: none repeat scroll 0% 0% #C92A00;
    /*border-color: rgb(153, 188, 232);*/
    color: white;
    border-width: 1px !important;
    border-style: solid;
    border-color: #ffffff !important;
}

.x-custom-time-label .x-form-field, .x-custom-

time-label .x-form-display-field {
    margin: 0px;
    font: 12px tahoma,arial,verdana,sans-serif;
    color: white;
}

.eien-custom-button .x-btn {
    display: inline-block;
    position: absolute !important;
    cursor: pointer;
    white-space: nowrap;
    vertical-align: middle;
    background-repeat: no-repeat;
    margin-left: 0px !important;
}

/*.eien-custom-button .x-btn-default-small {
    border-radius: 0px 0px 0px 0px;
    padding: 2px;
    border-width: 1px;
    border-style: solid;
    background-color: white;
    background-image: -moz-linear-gradient

(center top , 
    darkOrange, darkOrange 48%, darkOrange 52%, 
    darkOrange);
    margin-left:440px !important;
}*/

.eien-custom-button .x-box-inner {
    /*width:56px !important;-- 20140310 Commented by Bona*/
    width: 79px !important;
    /*height:22px !important;
    margin-left:50% !important;*/
    margin: 0 auto !important;
}

.eien-custom-button .x-btn-inner {
    color: White;
    background-color: darkOrange;
    font-weight: bold;
    font-size: 13px;
}

.eien-custom-button .x-btn-default-toolbar-

small-over {
    border-color: #81A4D0;
    /*border:0px !important;*/
    border-bottom: 0px !important;
    border-left: 0px !important;
    border-right: 0px !important;
    border-top: 0px !important;
}

.eien-custom-button .x-box-item {
    /*position: absolute !important;
    left: 0px;
    top: 0px;*/
    /*width:100%;*/
    /*width:56px; --20140310 Commented by Bona*/
    width: 79px;
    margin: 0 auto !important;
}

.eien-custom-button .x-btn-default-toolbar-

small {
    border-radius: 3px 3px 3px 3px;
    padding: 2px;
    border-width: 1px;
    border-style: solid;
    background-color: transparent;
    margin-left: 50%;
}

/*
.x-btn-default-toolbar-small {
    border-color: transparent;
}*/

.registrationLabelAlign {
    margin: 0px 0px 0px 115px;
}


/*Change Password*/
.chPasswordWrap {
    margin: 0 auto;
    width: 470px;
    height: 355px;
    /*background-color:#C92A00;*/
}

    .chPasswordWrap .btnWrap {
        /*background-color:Blue; */
        clear: both;
        width: 100%;
        height: 9%;
        margin: 0 auto;
        padding-left: 40%;
        color: #ffffff !important;
    }

    .chPasswordWrap .wrapHeaderTitle {
        font-weight: bold;
        font-size: medium;
        color: white;
        text-align: left;
        font-family: Arial;
        margin-top: 5px;
        margin-bottom: 5px;
        border-bottom: 1px solid white;
    }

    .chPasswordWrap .headerText {
        padding-left: 5px;
    }

.btnWrap .buttonObject {
    position: absolute;
    margin: 0 auto;
    float: left;
    /*margin-left:5px;*/
    width: 100px;
    height: 30px;
}

.eien-custom-toolbar div.x-toolbar {
    font-size: 15px;
    border: 0px solid;
    padding: 2px 0 2px 2px;
}

.eien-custom-toolbar x-toolbar-default {
    border-color: #99BCE8;
    background-image: none;
    background-color: #C92A00;
    background-image: -webkit-gradient (linear,50% 0,50% 100%,color-stop

(0%,#C92A00),color-stop(100%,#C92A00));
    background-image: -webkit-linear-gradient (top,#C92A00,#C92A00);
    background-image: -moz-linear-gradient (top,#C92A00,#C92A00);
    background-image: -o-linear-gradient (top,#C92A00,#C92A00);
    background-image: -ms-linear-gradient (top,#C92A00,#C92A00);
    background-image: linear-gradient (top,#C92A00,#C92A00);
}

x-custom-Right-form .x-panel-body-default {
    background: white;
    border-color: #ffffff !important;
    color: black;
    border-width: 1px !important;
    border-style: solid;
}

/*x-form-item-label*/

.eien-custom-label .x-form-item-label-left {
    width: 200px !important;
    margin-right: 5px !important;
}

a.changePassLinkPosition {
    color: White;
    margin-left: 38%;
    font-weight: bold;
}

.login_Border {
    background-color: darkOrange;
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    border: 1px solid #ffffff;
}

    .login_Border .loginTitle {
        border-bottom: 1px solid #ffffff;
        font-size: larger;
        font-weight: bold;
    }

/*.login_BorderResendTicket
{
    background-color:darkOrange;
    margin-right: auto; 
    margin-left: auto; 
    width: 400px; 
    border:1px solid #ffffff;
}

.login_BorderResendTicket .loginTitle
{
    border-bottom:1px solid #ffffff;
    font-size:larger;
    font-weight:bold;
}
*/

.resendTicketBorder {
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    /*border-style: solid;*/
    margin-top: 5px;
    background: #C92A00;
    box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */
}

.changePasswordBorder {
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    min-height: 210px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: #C92A00;
    text-align: center;
    border-radius: 7px;
}

.userLoginBorder {
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: #C92A00;
}

.userForgotPasswordBorder {
    margin-right: auto;
    margin-left: auto;
    width: 400px;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    margin-top: 5px;
    background: #C92A00;
}

.wrapReportTicketSales {
    width: 100%;
    height: 100%;
}

.reportTicketSalesBorderLeft {
    /*margin-right: auto; 
    margin-left: auto; */
    width: 49.6%;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    /*margin-top: 5px;   */
    background: #C92A00;
    float: left !important;
    /*padding-left:6px;*/
    height: 360px;
}

.reportTicketSalesBorderRight {
    /*margin-right: auto; 
    margin-left: auto; */
    width: 49.6%;
    /*border-style: solid;*/
    border: 1px solid #ffffff;
    /*margin-top: 5px;   */
    background: #C92A00;
    margin-left: 6px;
    float: left !important;
    /*padding-left:6px;*/
    height: 360px;
}

.eien-custom-label-color .x-form-item-label {
    display: block;
    padding: 3px 0px 0px;
    font-size: 12px;
    -moz-user-select: -moz-none;
    cursor: default;
    color: #ffffff !important;
}

.combo-2column-list {
    width: 200px;
    font: 11px tahoma,arial,helvetica,sans- serif;
}

    .combo-2column-list th {
        font-weight: bold;
    }

    .combo-2column-list td, .combo-2column-list th {
        padding: 3px;
    }

.list-item {
    cursor: pointer;
}

/*gridPanel Style*/

.x-innerGrid-custom .x-grid3-scroller {
    overflow: scroll;
}

.styleGrid {
    height: 100%;
}

.x-innerGrid-custom {
    width: 100%;
}

    .x-innerGrid-custom .x-column-header {
        background: darkOrange url() repeat scroll 0 bottom;
        font: 12px/16px "segoe ui",arial,sans-serif;
        height: 22px;
        font-weight: bold;
        text-align: left;
        border-left-color: #ffffff;
        border-right-color: #ffffff;
    }

    .x-innerGrid-custom .x-panel-header-default {
        border: 1px solid rgb(153, 188, 232);
        font-size: 11px;
        background-color: darkOrange;
        background-image: -moz-linear-gradient (center top , darkOrange, darkOrange 45%, 
    darkOrange 46%, darkOrange 50%, darkOrange 

51%, darkOrange);
        background-image: -webkit-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        /*background-image: -webkit-linear-

gradient(center top , #AD3A88, 
        #AD3A88 45%, #AD3A88 46%, #AD3A88 50%, 
        #AD3A88 51%, #AD3A88);*/
        background-image: -webkit-linear-gradient (top, darkOrange, darkOrange 45%, darkOrange 

46%, 
        darkOrange 50%, darkOrange 51%, 

darkOrange);
        background-image: -o-linear-gradient(center top, #AD3A88, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        background-image: -ms-linear-gradient (center top , darkOrange, 
        darkOrange 45%, darkOrange 46%, 

darkOrange 50%, 
        darkOrange 51%, darkOrange);
        background-image: linear-gradient(center top, darkOrange, darkOrange 45%, darkOrange 46%, darkOrange 50%, darkOrange 51%, darkOrange);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7f04', endColorstr='#ff7f04',GradientType=1 );
        background-image: -ms-linear-gradient(top, darkOrange, darkOrange); /* IE10 */
    }

    .x-innerGrid-custom .x-column-header div {
        background-color: darkOrange !important;
        color: #ffffff;
    }

    .x-innerGrid-custom .x-column-header-over {
        background: #AD3A88 url() repeat 0 bottom !important;
    }

    .x-innerGrid-custom .x-column-header div {
        color: #ffffff;
    }

    .x-innerGrid-custom .x-panel-header-text-

    default {
        color: #ffffff;
        font-size: 11px;
        font-weight: bold;
        font-family: tahoma,arial,verdana,sans- serif;
        line-height: 17px;
    }

    .x-innerGrid-custom .x-grid-row-over .x-grid-

    cell {
        border-color: #ffffff;
        background: #C92A00;
        color: #ffffff;
    }

    .x-innerGrid-custom .x-grid-row-selected .x-

    grid-cell {
        background: url() repeat-x scroll 0 0 #AD3A88;
        border-color: #ffffff;
        border-style: solid;
    }

    .x-innerGrid-custom .x-innerGrid-row-selected

    TD,
    .x-innerGrid-custom .x-innerGrid-row-selected

    TD .company-link {
        background-color: #AD3A88 !important;
        color: #000000;
    }

    .x-innerGrid-custom .spanColumnsStyle {
        padding-left: 5px;
    }

    .x-innerGrid-custom .x-toolbar-default {
        background-color: darkOrange !important;
        border-color: darkOrange !important;
        background-image: -moz-linear-gradient (center top , darkOrange, darkOrange) !important;
        background-image: -webkit-gradient (linear,50% 0,50% 100%,color-stop

(0%,darkOrange),color-stop(100%,darkOrange)) !important;
        background-image: -webkit-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -moz-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -o-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: -ms-linear-gradient (top,darkOrange,darkOrange) !important;
        background-image: linear-gradient (top,darkOrange,darkOrange) !important;
    }

    .x-innerGrid-custom .x-custom-Right-form .x-

    panel-body-default {
        /*color: white !important;*/
    }

    .x-innerGrid-custom .x-grid-row .x-grid-cell {
        /*background-color: #FF8900;
    /*border-color: #FAFAFA #EDEDED #EDEDED;*/
        border-right: 0 solid #EDEDED;
        border-style: solid;
        border-width: 0;
        font: 11px/15px tahoma,arial,verdana,sans- serif;
        color: Black !important;
    }


/*Added by Erda on 20150603*/
.SyaratulStyle {
    text-align: justify;
    font-family: Arial;
    font-size: small;
    clear: both;
    vertical-align: top;
}

    .SyaratulStyle li {
        list-style-type: square;
        margin-left: 30px;
        margin-bottom: 10px;
    }


/*Added By Erda on 20151002*/
#row-Traject {
    width: 965px;
}

/* Added By Sutan 20200316 */
.linkPolicy {
	color: #fff !important;

	/*Modified By Sutan 20201218*/
	/*top: -25px;*/
	top: -5px;

	position: relative;

	/*Commented by thareq on 20200317*/
	/*text-decoration: none;*/

	font-style: italic;

	/*Added By Sutan 20201218*/
	font-size: 10px;

    margin-top: 1rem;

}

/* Added By Sutan 20200317 */
.linkPolicy2 {
	color: #fff;

	/*Modified By Sutan 20201218*/
	/*top: -25px;*/
	top: -5px;

	left: -5px;
	position: relative;
}

/*Added By Thareq on 20221003*/
.sleeperSeat {
    margin:0!important;
}
