/*reset*/

body, h1, h2, h3, .main-nav, .sagi-nav, #banner p, .browsers, .mobileOSs, #footer ul, #footer p, #nav-pager, #examples-list, #themeChooser, .widgetGrid ul {
    margin: 0;
    padding: 0;
    list-style: none;
}


body, *html {
   
    min-height: 100%;
    min-width: 100%;
    overflow: auto !important;
}


/* scroll bar css starts*/


/* scroll bar css ends*/
img {
    border: 0;
}

#header a, li > a, h2 > a, h3 > a, #footer a, .get-sagiui {
    text-decoration: none;
}

#header {
    background: url("../images/header_LBg.png") no-repeat left top;
}

UL LI a, li a {
    cursor: pointer;
    -webkit-transition: background .2s ease-in-out;
    -moz-transition: background .2s ease-in-out;
    -o-transition: background .2s ease-in-out;
    transition: background .2s ease-in-out;
}

h2 {
    color: #25466d;
    font-size: 1.8rem;
    font-weight: 300;
    font-family: Verdana;
    padding: 5px 3px 3px 15px;
    -webkit-text-shadow: rgba(0,0,0,.9) 0 1px 0;
    text-shadow: rgba(0,0,0,.9) 0 1px 0;
}

h4 {
    color: #886c76;
    font-size: 1em;
    font-weight: 300;
    font-family: Verdana;
    padding: 5px 3px 3px 25px;
    -webkit-text-shadow: rgba(0,0,0,.9) 0 1px 0;
    text-shadow: rgba(0,0,0,.9) 0 1px 0;
}

/*global*/
.floatWrap:after, #example:after {
    content: "";
    display: block;
    clear: both;
}


.floatWrap, #example {
    display: block;
}

.hideControl {
    display: none;
}

.clear {
    clear: both;
}

html {

    font: 75% Verdana;
}

#header, #banner, .suite-demos-nav, .demos-nav,
.search-panel, #footer, .centerWrap {
    font-family: Verdana;
}

.overview,
#footer {
    font-size: 13px;
}

    .overview #header,
    .overview #banner,
    .overview .suite-demos-nav,
    .overview .demos-nav,
    .overview #footer {
        /*iPad fix*/
        min-width: 990px;
    }

.centerWrap {
    /*width:940px;*/
    margin: 0;
    padding: 0;
}

.widgetGrid .centerWrap {
    /*width:976px;*/
}
/*header*/
#header h1 {
    width: 240px;
    height: 37px;
    float: left;
    margin: 14px 100px 14px 0px;
}

.overview #header h1 {
    width: 223px;
    height: 73px;
    margin: 16px 0 0;
}

#logo {
    display: block;
    height: 100%;
    text-indent: -4444px;
    text-align: center;
    overflow: hidden;
    background: url(../images/logo-inner.png) no-repeat left top;
    height: 60px;
    margin-top: -7px;
    margin-left: 10px;
}

.AlignRight
	{
		text-align:right !important;
	}
.AlignLeft
	{
		text-align:left !important;
	}
.AlignCenter
	{
		text-align:center !important;
	}

.float-left
    {
    float:left;
    }

.no-display
    {
        display:none !important;
    }

#header ul {
    float: right;
    clear: right;
    color: #f2a93d;
    margin-top: 25px;
    margin-right: 10px;
}

.main-nav {
    margin: 22px -8px 0 0;
}

    .main-nav > li,
    .sagi-nav > li {
        float: left;
        position: relative;
    }

    .main-nav > li {
        border-left: 1px solid #dcdcdc;
        padding: 0 8px;
    }

    .main-nav li:first-child {
        border: 0;
    }

.suite-demos-nav a: {
    color: #fff;
    /*background:#ffa200;*/
    padding: 0px 5px 0px 5px;
}

.main-nav a {
    color: #2e2e2e;
}

.sagi-nav {
    margin: 10px 0px 0px 0px;
}

.overview .sagi-nav {
    margin: 22px 0;
}

.sagi-nav > li {
    width: 30px;
    height: 30px;
    margin-right: 8px;
    background-color: #004865;
    border-radius: 5px;
    cursor: pointer;
}

    .sagi-nav > li:hover {
        background-color: #004865;
    }

.sagi-nav a {
    display: block;
    font: 21px/1.6 Verdana;
    color: #2e2e2e;
    text-align: center;
    line-height: 45px;
    width: 30px;
    height: 30px;
    background-color: #004865;
    border-radius: 5px;
    cursor: pointer;
}

.icon-home {
    background: url(../images/nav-one.png) no-repeat 1px 3px;
}

    .icon-home:hover {
        background: url(../images/home-hover.png) no-repeat 1px 3px;
    }

.icon-save {
    background: url(../images/save.gif) no-repeat 1px 3px;
}


.icon-cashe {
    background: url(../images/nav-two.png) no-repeat 1px 3px;
}

    .icon-cashe:hover {
        background: url(../images/cashe-hover.png) no-repeat 1px 3px;
    }

.icon-prev {
    background: url(../images/nav-three.png) no-repeat 1px 3px;
}

    .icon-prev:hover {
        background: url(../images/arrow-hover.png) no-repeat 1px 3px;
    }

.icon-about {
    background: url(../images/nav-four.png) no-repeat 1px 3px;
}

    .icon-about:hover {
        background: url(../images/nav-four-hover.png) no-repeat 1px 3px;
    }

.icon-logout {
    background: url(../images/nav-five.png) no-repeat 1px 3px;
}

    .icon-logout:hover {
        background: url(../images/logout-hover.png) no-repeat 1px 3px;
    }

.icon-expand {
    background: #1f92b8 url(../images/nav-down-arrow.png) no-repeat 9px 9px !important;
    font-size: 0px !important;
    background-size: 17px !important;
}

.icon-expand:hover, .icon-expand[allcollapsed="true"]:hover {
    background-color: #2b768e;
}

.icon-expand[allcollapsed="true"] {
    background: #1f92b8 url(../images/nav-up-arrow.png) no-repeat 9px 9px !important;
    font-size: 0px !important;
    background-size: 17px !important;
}


.main-nav a > span,
.sagi-nav a > span {
    font: .55em/1;
    position: relative;
    top: -.2em;
}

#header .get-sagiui,
#mainWrap .get-sagiui {
    color: #fff;
}

.sagi-nav .get-sagiui {
    font-size: 17px;
    line-height: 34px;
}

.get-sagiui:hover,
.launchButton:hover {
    filter: alpha(opacity=80);
    opacity: .8;
}

.sagi-nav .active,
.suite-demos-nav .active,
#footer .centerWrap,
#codeStrip .k-state-active {
    position: relative;
}
/*orange bar*/
#banner {
    background: 50% 50% url(../images/flowerWrap.png);
    min-height: 2px;
}

.overview #bannerInner {
    padding: 30px 0 10px 0;
    background: 50% 0 url(flowers.png);
}

#bannerInner > .centerWrap {
    height: 100%;
}

#banner h1 {
    font-size: 30px;
    line-height: 32px;
    margin-bottom: 20px;
    color: white;
    font-weight: normal;
}
/*suite demos nav*/

.suite-demos-nav {
    height: 66px;
    background: #FFA200 url(../images/vrHeader.png) repeat-x left top;
}

    .suite-demos-nav ul {
        list-style: none;
    }

    .suite-demos-nav a {
        display: block;
        font-size: 13px;
        /*line-height:46px;*/
        color: #fff;
    }

.mainMenuIcon {
    width: 24px;
    height: 24px;
    display: block;
    margin: 0 auto;
}

.mainMenuIconPerson {
    width: 24px;
    height: 24px;
    display: block;
    margin: 0 auto;
}

.mainMenuIconOrga {
    width: 24px;
    height: 24px;
    display: block;
    margin: 0 auto;
}

.mainMenuIconPay {
    width: 24px;
    height: 24px;
    display: block;
    padding-left: 30px;
}

.suite-demos-nav .active:before,
.suite-demos-nav .active:after {
    content: " ";
    display: block;
    left: 50%;
    margin: 0 0 0 -7px;
    position: absolute;
    top: 40px;
    width: 0;
    height: 0;
}

.suite-demos-nav .selected {
    background: #ffa200;
}

.suite-demos-nav li:hover {
    background: #ffa200;
}

.suite-demos-nav .active:last-child:after {
    border-color: #fff transparent;
}

.suite-demos-nav .active:before {
    border-color: #c9c9c9 transparent;
    margin-top: -1px;
}
/*featured demos and demos-nav*/
.demos-nav,
.sourceChooser,
#codeStrip .k-content.k-tabstrip .k-tabstrip-items {
    background: url(../images/vrBg.png) repeat-x left top;
}
/*inner pages*/
.search-panel {
    padding-bottom: 3em;
}

.search-panel {
    border-left: 2px solid #35272b;
    min-height: 533px;
    float: left;
}

#main {
    float: left;
    width: 759px;
    margin-left: -2px;
}
/*widget grid*/
.widgetGrid .wideCol:first-child,
.widgetGrid .narrowCol:first-child {
    background: #eee;
    background: rgba(191,191,191,.2);
}

.widgetGrid .wideCol,
.widgetGrid .narrowCol {
    float: left;
    width: 650px;
}

.widgetGrid .narrowCol {
    width: 310px;
}

    .widgetGrid .narrowCol ul:empty {
        display: none;
    }

.widgetGrid .mobile-widgets {
    width: 340px;
}

.widgetGrid ul {
    float: left;
    width: 150px;
    margin: 8px 0 0 18px;
    padding: 0px 0 10px 0px;
    background: url(../images/vrDevider.png) no-repeat right center;
}

.widgetGrid li {
    line-height: 25px;
    padding: 0px 0px 0px 15px;
    background: url(../images/Icon_Dots.png) no-repeat left center;
}

.widgetGrid a {
    color: #fff;
}

    .widgetGrid a:hover {
        color: #e26b1d;
    }
/* Search Navigation */
#main {
    /*margin: 80px auto;*/
    position: relative;
    width: 40px;
}

* {
    margin: 0;
    padding: 0;
}

#navigationMenu li {
    list-style: none;
    /*height:326px;
	padding:2px;*/
    width: 30px;
}

#navigationMenu a {
    background: url(../images/navigation.png) no-repeat;
    height: 167px;
    width: 30px;
    display: block;
    position: relative;
}
    /* General hover styles */
    #navigationMenu a:hover span {
        width: auto;
        padding: 0 20px;
        overflow: visible;
    }

    #navigationMenu a:hover {
        text-decoration: none;
        /* CSS outer glow with the box-shadow property */
        -moz-box-shadow: 0 0 5px #b5b599;
        -webkit-box-shadow: 0 0 5px #b5b599;
        box-shadow: 0 0 5px #939391;
    }
/* Search Button */
#navigationMenu .search {
    background-position: 0 0;
}

    #navigationMenu .search:hover {
        background-position: left top;
        width: 750px;
        height: 167px;
        background-color: #35272b;
        border-top-right-radius: 1em;
        border-bottom-right-radius: 1em;
    }

    #navigationMenu .search span {
        -webkit-text-shadow: 1px 1px 0 #99bf31;
        text-shadow: 1px 1px 0 #99bf31;
    }
/* Navigation Button */
#navigationMenu .navigation {
    background-position: left -168px;
}

    #navigationMenu .navigation:hover {
        background-position: left -168px;
        width: 750px;
        height: 167px;
        background-color: #35272b;
        border-top-right-radius: 1em;
        border-bottom-right-radius: 1em;
    }

    #navigationMenu .navigation span {
        color: #223a44;
        -webkit-text-shadow: 1px 1px 0 #44a8d0;
        text-shadow: 1px 1px 0 #44a8d0;
    }

/* New Menu Style Starts Here */
#menu {
    list-style: none;
    padding: 0px 20px 0px 20px;
}

    #menu li {
        float: left;
        margin: 26px 0px 0px 0px;
        margin: 22px 0px 0px 0px\9;
        padding: 0px 5px 0px 5px;
        background: #483D39;
        border-right: 5px solid #35262a;
        -webkit-transition: background 1s ease-in-out;
        -moz-transition: background 1s ease-in-out;
        -o-transition: background 1s ease-in-out;
        transition: background 1s ease-in-out;
    }

    #menu li, x:-moz-any-link, x:default {
        float: left;
        margin: 21px 0px 0px 0px;
        margin: 22px 0px 0px 0px\9;
        padding: 0px 5px 0px 5px;
        background: #483D39;
        border-right: 5px solid #35262a;
        -webkit-transition: background 1s ease-in-out;
        -moz-transition: background 1s ease-in-out;
        -o-transition: background 1s ease-in-out;
        transition: background 1s ease-in-out;
    }

        #menu li.selected {
            background: #ffa200;
        }

        #menu li:hover {
            /* Background color and gradients */
            background: #ffa200;
            background: -moz-linear-gradient(top, #ffa200, #ffa200);
            background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffa200), to(#ffa200));
        }

        #menu li a {
            font-size: 13px;
            color: #eee;
            display: block;
            outline: 0;
            padding: 0px 5px 0px 5px;
            text-decoration: none;
            -webkit-transition: background .2s ease-in-out;
            -moz-transition: background .2s ease-in-out;
            -o-transition: background .2s ease-in-out;
            transition: background .2s ease-in-out;
        }

        #menu li:hover a {
            color: #fff;
        }

        #menu li ul li {
            border: 0px !important;
        }

.dropDownMenu {
    margin: 0px auto;
    float: left;
    position: absolute;
    left: -999em; /* Hides the drop down */
    text-align: left;
    padding: 8px 5px 0px 5px;
    /* Gradient background */
    background: #3b322f;
    height: 200px;
    background: -moz-linear-gradient(top, #3b322f, #3f3531);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3b322f), to(#3f3531));
}

.dropDownMenu {
    width: 99%;
}

#menu li:hover .dropDownMenu {
    left: 1px;
    top: auto;
    z-index: 9999;
    border-top: 2px solid #ffa200;
    color: #463b37;
}

.columns {
    display: inline;
    float: left;
    position: relative;
    margin-left: 5px;
    margin-right: 5px;
}

    .columns .single {
        display: block;
        overflow: hidden;
        width: 250px;
        height: 125px;
    }


    .columns .double {
        display: block;
        overflow: hidden;
        width: 550px;
        height: 125px;
    }

    .columns .triple {
        display: block;
        overflow: hidden;
        width: 775px;
        height: 125px;
    }

    .columns .fourth {
        display: block;
        overflow: hidden;
        width: 1000px;
        height: 125px;
    }

#menu li:hover div a {
    font-size: 12px;
    color: #fff;
}

    #menu li:hover div a:hover {
        color: #fff;
        line-height: 27px;
        margin: 0px 0px 0px -15px;
        padding: 0px 15px 0px 19px;
        background: #ffa200 url(../images/Icon_White_Dots.png) no-repeat left center;
    }

#menu li ul {
    list-style: none;
    margin: 0 0 12px 0;
    margin: 8px 0 0 18px;
    padding: 0px 0 10px 0px;
    /*background:url(../images/vrDevider.png) repeat-y right center;*/
}

    #menu li ul li {
        position: relative;
        padding: 0;
        margin: 0;
        display: block;
        width: 225px;
        float: left;
        line-height: 27px;
        padding: 0px 15px 0px 15px;
        background: url(../images/Icon_Dots.png) no-repeat left center;
    }

        #menu li ul li:hover {
            background: none;
            border: none;
            padding: 0;
            margin: 0;
            width: 225px;
            padding: 0px 15px 0px 15px;
        }


/******** NEW *******/

#SlideOutOtherTriger {
    background: url(../images/navigation.png) no-repeat;
    background-position: 0 0;
    height: 167px;
    width: 30px;
    display: block;
    position: relative;
    z-index: 200;
    cursor: pointer;
}





#CenterMiddle {
}

#MiddleSplitter {
    position: relative !important;
}

#WestPanel {
    padding-top: 10px;
}

#ContentSplitter {
 
    margin-left: 10px;
}


#NorthSplitter {
    height: 75px !important;
}

#RightContentSplitter {
    padding-left: 10px;
}

.CriteriaDiv {
    background-color: #ffffff;
    border-top-left-radius: 1em;
    border-top-right-radius: 1em;
    padding: 10px;
    height: 92%;
}

.sectionhead {
    color: #423834;
    font-size: 17px;
    font-weight: 400;
    font-family: Verdana;
    padding: 20px 3px 5px 20px;
}


.ResultDiv {
    background-color: #FFFEF5;
    border-bottom-left-radius: 1em;
    border-bottom-right-radius: 1em;
    padding: 10px;
}


#CenterLeft .sectionhead {
    color: #423834;
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana;
    padding: 0px 3px 15px 0px;
    margin-bottom: 5px;
}

#CenterLeft .ResultDiv {
    background-color: #f6f6f6;
    padding: 10px;
    margin-bottom: 5px;
    border-radius: 0;
    background: #ecede7; /* Old browsers */
    background: -moz-linear-gradient(top, #ecede7 0%, #cccdbd 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ecede7), color-stop(100%,#cccdbd)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ecede7 0%,#cccdbd 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ecede7 0%,#cccdbd 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ecede7 0%,#cccdbd 100%); /* IE10+ */
    background: linear-gradient(to bottom, #ecede7 0%,#cccdbd 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ecede7', endColorstr='#cccdbd',GradientType=0 ); /* IE6-9 */
    border: 1px solid #CCC;
}


#LookupParent {
    width: 100%;
    height: 100%;
    display:none;
}

#LookupHolder {
    border-radius: 1em;
    /*background: #acbe78;*/
    background: #D4D5C7;
    height: 96%;
    width: 100%;
}

.LookupFormParant {
    overflow: auto;
    height: 100%;
    width: 100%;
    margin-right: 20px;
}

.preloader {
    height: 50px;
    width: 50px;
    background: rgba(0,0,0,.3) url(../images/preloader.png) no-repeat center center !important;
}

#SouthSplitter {
    background-color: #0a384c !important;
    color: #fff;
    padding: 2px 0px 2px 5px;
}

.rotate {
    -moz-transform: rotate(270deg);
    -moz-rotation-point: 0 0;
    -webkit-transform: rotate(270deg);
    -webkit-rotation-point: 0 0;
    rotation-point: 0 0;
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    height: auto;
    width: auto;
    position: relative;
    letter-spacing: 1px;
}


#CloseRightForm {
    right: 20px;
    position: absolute;
}

.ErrorDiv {
    color: red;
    padding: 2px;
}

.fakelink {
    color: #00f !important;
    cursor:pointer;
    text-decoration: underline;
}

.fakeLableLink:hover {
    color: #0D638F;
    cursor: pointer;
    text-decoration: underline;
}

.fakeLableColor {
    color: #0D638F;
}


.WhiteText {
    display: none ;
}



.cssmenu li {
    margin: 0;
    padding: 0;
}


.cssmenu ul {
    list-style: none;
    margin-left: 60px;
}

.cssmenu li a {
    text-decoration: none;
    margin: 0;
    padding: 0;
}

.cssmenu {
    height: 35px;
    clear: left;
    float: left;
    width: 100%;
    border-top: 1px solid #2b5b73;
    /*background: #b6eaff; */ /* Old browsers */
    background: rgb(52,176,207);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzM0YjBjZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNzU2NmEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(52,176,207,1) 0%, rgba(7,86,106,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(52,176,207,1)), color-stop(100%,rgba(7,86,106,1)));
    background: -webkit-linear-gradient(top, rgba(52,176,207,1) 0%,rgba(7,86,106,1) 100%);
    background: -o-linear-gradient(top, rgba(52,176,207,1) 0%,rgba(7,86,106,1) 100%);
    background: -ms-linear-gradient(top, rgba(52,176,207,1) 0%,rgba(7,86,106,1) 100%);
    background: linear-gradient(to bottom, rgba(52,176,207,1) 0%,rgba(7,86,106,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#34b0cf', endColorstr='#07566a',GradientType=0 );
}

    .cssmenu > ul > li {
        float: left;
        position: relative;
        height: 35px;
        border-left: 1px solid #FFFFFF;
    }

        .cssmenu > ul > li:first-child {
            border-left: none;
        }

        .cssmenu > ul > li > a {
            color: #FFFFFF;
            font-family: Verdana, 'Lucida Grande';
            font-size: 12px;
            padding: 10px 25px;
            -webkit-transition: color .15s;
            -moz-transition: color .15s;
            -o-transition: color .15s;
            transition: color .15s;
            line-height: 35px;
        }


            .cssmenu > ul > li > a:hover {
                color: #fff;
                background: #113745;
            }


        .cssmenu > ul > li > ul {
            opacity: 0;
            visibility: hidden;
            padding: 2px;
            background-color: rgb(250,250,250);
            text-align: left;
            position: absolute;
            left: 50%;
            margin-left: -30px;
            width: 250px;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
            -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
            -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
            box-shadow: 0px 1px 3px rgba(0,0,0,.4);
        }

        .cssmenu > ul > li:hover > ul {
            opacity: 1;
            top: 35px;
            visibility: visible;
        }

        .cssmenu > ul > li > ul:before {
            content: '            ';
            display: block;
            border-color: transparent transparent rgb(250,250,250) transparent;
            border-style: solid;
            border-width: 10px;
            position: absolute;
            top: -18px;
            left: 50%;
            margin-left: -115px;
        }

        .cssmenu > ul > li > ul > li > ul:before {
            content: '            ';
            display: block;
            border-color: transparent #FFFFFF transparent transparent;
            border-style: solid;
            border-width: 10px;
            position: absolute;
            top: 2px;
            margin-left: -21px;
        }



    .cssmenu > ul ul > li {
        position: relative;
    }

    .cssmenu ul ul a {
        color: rgb(250,250,250);
        font-family: Verdana, 'Lucida Grande';
        font-size: 12px;
        background-color: #2c748f;
        padding: 5px 8px 7px 16px;
        display: block;
        white-space: nowrap;
        -webkit-transition: background-color .1s;
        -moz-transition: background-color .1s;
        -o-transition: background-color .1s;
        transition: background-color .1s;
        border-bottom: 1px solid #FFFFFF;
    }

        .cssmenu ul ul a:hover {
            background-color: #193A46;
            color: #FFFFFF;
        }

    .cssmenu ul ul ul {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 0px;
        left: 206px;
        margin-left: 55px;
        padding: 0px;
        background-color: rgb(250,250,250);
        text-align: left;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        -o-transition: all .3s;
        transition: all .3s;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        z-index: 9999;
        border: 1px solid #FFFFFF;
        -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
        -moz-box-shadow: 0px 1px 3px rgba(0,0,0,.4);
        box-shadow: 0px 1px 3px rgba(0,0,0,.4);
    }





    .cssmenu ul ul > li:hover > ul {
        opacity: 1;
        left: 196px;
        visibility: visible;
    }


.captionTd {
    text-align: right;
    line-height: 20px;
    padding-left: 20px !important;
    font-weight: bold;
}

.Table {
    white-space: normal;
    text-align: left !important;
    width: 100%;
}

    .Table td {
        padding: 3px 5px 2px 3px;
    }

#CenterLeft > ul {
    margin-top: 25px;
}



.highlighted {
    background-color: #6c9cc6 !important;
}

.centerleft-fieldset {
    padding: 5px;
    margin: 5px 0px 5px 0px;
}

.centerleft-legend {
    font-weight: bold;
    border: 1px solid #333333;
    padding: 3px;
    background: #fffef5;
    color: #333333;
}

.literal {

}


.org-image {
    background: url(../Images/org-out.png);
    width: 15px;
    height: 90px;
    float: right;
    top: -430px;
    position: relative;
    left: 25px;
}

.lookups-image {
    background: url(../Images/lookups-out.png);
    width: 15px;
    height: 120px;
    float: right;
    top: -627px;
    position: relative;
    left: 36px;
}

.navigator-image {
    background: url(../Images/navigator-out.png);
    width: 15px;
    height: 120px;
    float: right;
    top: -500px;
    position: relative;
    left: 15px;
}

.navDiv {
    background-color: #bbbda5;
    border-top-left-radius: 1em;
    border-top-right-radius: 1em;
    padding: 10px;
    height: 92%;
    border: 3px solid #255b88;
    overflow: auto;
}


.dashboardContainer {
    width: 100%;
}



.ChartConfig {
    display: none;
}

.btnLookupChartConfig {
    background: url(../Images/setting.png);
    width: 20px;
}

.CheckBoxListGap {
    padding-left: 10px;
}

.SelectedCheckBox {
    background: url(../Images/CheckedBox.gif);
    background-repeat: no-repeat;
    height: 20px;
    width: 20px;
}

.UnSelectedCheckBox {
    background: url(../Images/UnCheckedBox.gif);
    background-repeat: no-repeat;
    height: 20px;
    width: 20px;
}

#LookupName {
    margin: 10px 0px 0px 10px;
}

#GlobalMessageDiv {
    padding: 5px;
    font-weight: bold;
    vertical-align: middle;
    margin-top: 0px;
    box-shadow: 0px 0px 0px 0px #333333;
}

.GlobalMessage {
    background: #333333 !important;
    color: #ffffff !important;
    margin-bottom:10px;
}

.GlobalError {
    color: red !important;
    border: 1px solid red;
}

.k-tooltip-content {
    text-align: justify;
}

.welcome-text {
    font-size: 14px;
    margin-left: -8px;
    font-weight: bold;
}


.k-progress {
    border: none !important;
}

.k-filename {
    max-width: none;
}

.caption-style {
    font-weight: bold;
    font-size: 14px;
}

.bottom-border-class {
    border-bottom: 3px solid #003f59 !important;
}

.ReqInformation {
    color: OrangeRed !important;
    padding-left: 3px;
}

.NoteText {
    font-size: 11px;
    text-align: left;
}

#ExpiredMessage {
    font-size: 12px;
}

.boxdiv {
    margin: 20px 0px 10px 0px;
    font-size: 14px;
    color: #333333;
    border: 2px solid #777777;
    padding: 5px;
    background: #bcf2ff;
}

.marg-left-5 {
    margin-left: 5px;
}

#cssmenuLeft ul li a {
    height: 30px;
    color: #222222;
    border-radius: 0px !important;
    line-height: normal;
    background: #3997a8; /* Old browsers */
    background: -moz-linear-gradient(top, #3997a8 0%, #00798f 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3997a8), color-stop(100%,#00798f)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #3997a8 0%,#00798f 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #3997a8 0%,#00798f 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #3997a8 0%,#00798f 100%); /* IE10+ */
    background: linear-gradient(to bottom, #3997a8 0%,#00798f 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3997a8', endColorstr='#00798f',GradientType=0 ); /* IE6-9 */
}

#cssmenuLeft ul li ul li a {
    height: 25px;
    background: #183945;
    color: #FFFFFF;
    border-radius: 0px !important;
    padding-left: 12px;
    border-bottom: 1px solid #FFFFFF;
    line-height: 25px;
}


textarea {
    border: 1px solid #94c0d2;
    line-height:13px !important;
}

#MyBasket {
    /*background: #acbe78;*/
    background: #F5FFAE;
    height: 98%;
    width: 96%;
    padding: 5px;
}



.MyBasket-image {
    background: url(../Images/mybasket-out.png);
    width: 15px;
    height: 120px;
    float: right;
    top: 14px;
    position: absolute;
    right: -16px;
}

.mybasket-image {
    background: url(../Images/mybasket-out.png);
    width: 15px;
    height: 120px;
    float: right;
    top: 14px;
    position: absolute;
    right: -5px;
}

#header {
    width: 100%;
    height: 65px;
    float: left;
    padding-bottom: 10px;
    background: rgb(255,255,255);
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM4N2ZmZjUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(135,255,245,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(135,255,245,1)));
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(135,255,245,1) 100%);
    background: -o-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(135,255,245,1) 100%);
    background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(135,255,245,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(135,255,245,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#87fff5',GradientType=0 );
}


/*Dashboard CSS*/
#DashboardList {
    background: #f5f5f5;
    min-height: 600px;
    padding: 12px 0px 25px 0px;
}

.widget {
    float: left;
    border: 1px solid #333333;
    background: #FFFFFF;
    width: 100%;
    margin-bottom: 15px;
}

.contents {
    width: 100%;
    overflow: auto;
}

.column-one {
    width: 30%;
    height: auto;
    float: left;
}

.column-two {
    width: 30%;
    height: auto;
    float: left;
    margin-left: 5%;
}

.column-three {
    width: 30%;
    height: auto;
    float: right;
}

.div-header {
    width: 100%;
    height: 25px;
    float: left;
    cursor: move;
    background: #036;
}

.div-header-text {
    font-family: Verdana;
    font-size: 14px;
    color: #FFFFFF;
    height: 30px;
    line-height: 25px;
    width: auto;
    float: left;
    padding-left: 10px;
}

.div-header-icon {
    width: auto;
    float: right;
    height: 25px;
    padding-top: 5px;
}

    .div-header-icon img {
        margin-right: 10px;
        margin-top: 7px;
        cursor: pointer;
    }

.icon-close {
    width: 15px;
    height: 15px;
    float: right;
    background: url(../Images/close.png);
    margin-right: 8px;
    cursor: pointer;
}

    .icon-close:hover {
        background: url(../Images/close-hover.png);
    }

.icon-minimize {
    width: 15px;
    height: 15px;
    float: right;
    background: url(../Images/minimize.png);
    margin-right: 8px;
    cursor: pointer;
}

    .icon-minimize:hover {
        background: url(../Images/minimize-hover.png);
    }

.icon-maximize {
    width: 15px;
    height: 15px;
    float: right;
    background: url(../Images/minimize.png);
    margin-right: 8px;
    cursor: pointer;
}

    .icon-maximize:hover {
        background: url(../Images/maximize-hover.png);
    }

.icon-refresh {
    width: 15px;
    height: 15px;
    float: right;
    background: url(../Images/refresh.png);
    margin-right: 8px;
    cursor: pointer;
}

    .icon-refresh:hover {
        background: url(../Images/refresh-hover.png);
    }

.icon-settings {
    width: 15px;
    height: 15px;
    float: right;
    background: url(../Images/settings.png);
    margin-right: 8px;
    cursor: pointer;
}

    .icon-settings:hover {
        background: url(../Images/settings-hover.png);
    }

.settings {
    border: solid 2px red;
}

.barcoli {
    border: 1px solid transparent;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;
    text-decoration: none;
}

.barstyle1 {
    background-color: rgb(75, 127, 190);
}

.barstyle2 {
    background-color: rgb(190, 75, 127);
}

.barstyle3 {
    background-color: rgb(127, 190, 75);
}

.barstyle4 {
    background-color: rgb(184, 190, 75);
}

.barstyle5 {
    background-color: rgb(190, 138, 75);
}

.barstyle6 {
    background-color: rgb(165, 191, 223);
}

.barstyle7 {
    background-color: rgb(138, 75, 190);
}

.DashboardColumn {
    float: left;
    border: solid 2px #e5e5e5;
    min-height: 600px;
    background: #FFFFFF;
    padding: 5px;
    display: table-cell;
    vertical-align: top;
}

.hint {
    width: 250px;
    height: 100px;
    overflow: hidden;
}

#DashboardColumn1 {
    width: 40%;
}

#DashboardColumn2 {
    width: 28%;
    margin-left: 0.8%;
}

#DashboardColumn3 {
    width: 28%;
    float: right !important;
}

//rule css .tableStyle {
    border-spacing: 0px;
    margin-left: 80px !important;
    margin-right: 10px !important;
}

.ItemstableStyle {
    border-spacing: 0px;
}

.tableBorder {
    border-spacing: 0px;
    padding: 0;
}

.tdStyle {
    border: 1px solid black;
    padding: 1px 10px 5px 20px;
    font-size: 12px;
}

.lineLeftBottom {
    border-left: 3px solid red;
    border-bottom: 3px solid red;
}

.lineBottom {
    border-bottom: 3px solid red;
}

.lineLeft {
    border-left: 3px solid red;
}

.minus {
    left: -55px;
    top: 20px;
    position: relative;
    background: url(../images/minus.jpg) !important;
    height: 9px;
    width: 9px;
    display: block;
}

.plus {
    left: -55px;
    top: 20px;
    position: relative;
    background: url(../images/plus.jpg) !important;
    height: 9px;
    width: 9px;
    display: block;
}

span {
    margin: 0px;
    padding: 0px;
}

.case:before {
    content: url(../images/case.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.default:before {
    content: url(../images/default.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.switch:before {
    content: url(../images/switch.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.method:before {
    content: url(../images/action.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.calllogicalrule:before {
    content: url(../images/calllogicalrule.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.return:before {
    content: url(../images/return.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.foreach:before {
    content: url(../images/foreach.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.foreach .ValueSpan {
    border-radius: 5px;
    padding: 5px;
    position: relative;
    top: -15px;
    right: -11px;
}


.actions:before {
    content: url(../images/icon.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.calldecisiontable:before {
    content: url(../images/calldecisiontable.png) !important;
    position: absolute !important;
    margin-left: -40px !important;
}

.ValueSpan {
    font-weight: bold;
    margin-right: 10px;
    color: #fff;
    padding: 3px;
    background-color: #555050;
}


.DecisionTable {
}

    .DecisionTable td, .DecisionTable th {
        padding: 5px;
        border: solid 1px black;
        font-size: 13px;
    }


.case_table .tdStyle {
    background-color: #feebc0;
}

.default_table .tdStyle {
    background-color: #feebc0;
}

.switch_table .tdStyle {
    background-color: #fff468;
}

.return_table .tdStyle {
    background-color: #77dde5;
}

.HighLightTable .tdStyle {
    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#bfd310), to(#b9cd12));
    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #b9cd12, #bfd310);
    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #b9cd12, #bfd310);
    /* IE 10 */
    background: -ms-linear-gradient(top, #b9cd12, #bfd310);
    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #b9cd12, #bfd310);
}




.FirstTD {
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
}

.LastTD {
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.LoopNavigator {
    font-size: 15px;
    font-weight: bold;
    padding: 5px;
    margin: 5px;
    background-color: aqua;
    cursor: pointer;
}

.SelectedLoopStep {
    background-color: #bfd310 !important;
}

.HighLightDecisionCell {
    background-color: #fffd5f;
}

.dif {
    background-color: #dcd61e;
}

.dreturn {
    background-color: #ffcc57;
}

.dreturnheader {
    background-color: #d2960c;
}

.dcolheader, .drowheader {
    /* Safari 4-5, Chrome 1-9 */
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ccc50d), to(#f2ec34));
    /* Safari 5.1, Chrome 10+ */
    background: -webkit-linear-gradient(top, #f2ec34, #ccc50d);
    /* Firefox 3.6+ */
    background: -moz-linear-gradient(top, #f2ec34, #ccc50d);
    /* IE 10 */
    background: -ms-linear-gradient(top, #f2ec34, #ccc50d);
    /* Opera 11.10+ */
    background: -o-linear-gradient(top, #f2ec34, #ccc50d);
}


.k-progress-status-wrap {
    width: 100% !important;
    color: #fff !important;
}

.GridHolder {
    width: 100% !important;
}

.ui-datepicker-trigger
{
    margin-left:5px;
    position:absolute;
}

option
{
    color:#333333;
}

#wfmMSSRetireeHomeMaintenance0 .trow
{
    border:0px;
}

#wfmMSSActiveMemberHomeMaintenance0 .trow
{
    border:0px;
}

.img-responsive
{
    margin-left:10px;
    float:left;
}

.hr-span
{
    width:100%;
    display:block;
    height:1px;
    background:#E0DFDF;
    float:left;
}


.italic-text
{
    font-style:italic !important;
    text-align:left !important;
}


#MainSplitter
{
    overflow:auto !important;
   
}

::-ms-clear {
    display:none;
}

#GridTable_grdFASFinalEsitmate tr td:last-child .k-textbox 
{
    width:90px !important;
}

#GridTable_grdFASFinalEsitmate tr td:last-child select
{
    width:90px !important;
    margin-left:5px;
}






/*****************************************   Customised Bootstrap CSS   **********************************************/

body {
     background-color: #364150 !important;
}

.form-subhead
{
    font-weight:bold;
    text-decoration:underline;
}


.page-header-fixed .page-container {
    
    margin-top:60px !important;
}


.page-header
{
    height:auto !important;
    background:#11243e;
}

.page-sidebar-menu > li.active > a
{
    background:#26a69a;
}

.form-actions
{
    float:left;
    width:100%;
    padding:10px 0px !important;
    text-indent:10px;
}

.user-info ul
{
    margin-left:10px;
    list-style-type:none;
}

.user-info li
{
    margin:10px 0px;
    color:#FFFFFF;
}

.nav > li > a {
    position: relative;
    display: block;
    padding:0px;
    border-radius:0px !important;
    margin-left:2px;
    margin-top:10px;
    width:35px;
    height:35px;
    text-align:center;
    line-height:35px;
    color:#FFFFFF;

}

.nav li:last-child a
{
    margin-right:10px;
}

.navbar-nav > li
{
    float:left;
}



.form-body
{
    margin-top:10px;
}



.row
{
    margin-left:0px !important;
}

#NotificationBar, #MessageAlertBar
{
    display:none;
}

.breadcrumb, .crumDiv, .GoToLinksTrigger
{
    display:none;
}


#btnRetrievePayrollHeader
{
    position:absolute;
    margin-left:5px;
    margin-top:2px;
}

.normal-text
{
    font-weight:normal !important;
}

.logo {
    float: left;
    width: 290px;
    height: 65px;
    background: url('../assets/img/logo.png');
    margin-left: 5px;
    width: 320px;
    background: url('../assets/img/derp-logo-new.png');
    background-repeat: no-repeat;
    background-position-y: center;
    background-size: contain;
}

.user-info
{
    margin-top:20px;
}

.page-title
{
    margin:0px 0px 0px 10px !important;
}

.page-sidebar .page-sidebar-menu .sub-menu li > a, .page-sidebar-fixed.page-sidebar-closed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a
{
    background:#b4bcc8;
    text-indent:10px;
}


.page-sidebar-menu a:hover
{
    
    background:#3e4b5c !important;
}



.page-sidebar-menu .sub-menu li
{
    border-bottom:1px solid #3d4957;
}

@media (max-width:991px)
{
    

   


   

   


    .Space-filler
    {

        display:none;
    }


}


@media (max-width:575px)
{
    .logo {
        float: left;
        width: 40px;
        height: 68px;
        background: url('../assets/img/logo-mobile.png');
        margin-left: 5px;
        width: 84px;
        background: url('../assets/img/derp-logo-mobile.png');
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
    }

}

@media (max-width:330px)
{
    .pull-right
    {
        float:none !important;

    }

    .page-header-fixed .page-container
    {
         margin-top:0px !important;

        }


}


/************** Breadcrumbs*************/

.breadcrumb {
    list-style: none;
    font: 11px Helvetica, Arial, Sans-Serif;
    float:left;

}

.breadcrumb-page-info
{
    float:left;
    margin-top: 8px !important;
}


    .breadcrumb li {
        float: left;
    }

       


.fleft
{
    float:left;
}

.fright
{
    float:right;
}


.bullets
{
    margin-left:10px;
}


.scrollable-grid
{
    width:100%;
    overflow:auto;
}

.bordered-box
{
    border:1px solid #888888;
    margin-bottom:5px;
}

.single-div-chkbx
{
    position:relative;
    top:7px;
}


.form-head
{
    border-radius:5px !important;
    background:#2f5980;
    padding:5px 10px !important;
    text-align:left !important;
}

.form-head label
{

    color:#FFFFFF !important;
    font-size:16px;
}



.blue-bordered-box
{
    border:1px solid #60aee4 !important;
    float:left !important;
    width:100% !important;
}

.blue-bordered-box .k-header, .blue-bordered-box .s-grid th
{
    /*border:0px !important;*/
    background:#3598dc !important;
    text-align:left !important;
    margin-bottom:15px;
    color:#FFFFFF !important;
}

.blue-bordered-box .k-upload.k-header
{
    background:#FFFFFF !important;
    color:#333333 !important
}

.blue-bordered-box .k-header.k-tabstrip
{
    background:transparent !important;

}

.blue-bordered-box .k-content
{
    width:100% !important;
    padding:0px !important;
}

.purple-bordered-box
{
    border:1px solid #a57fb5 !important;
    float:left !important;
    width:100% !important;
}

.purple-bordered-box .k-header, .purple-bordered-box .s-grid th
{
    /*border:0px !important;*/
    background:#8e5fa2 !important;
    text-align:left !important;
    margin-bottom:15px;
    color:#FFFFFF !important;
}


.purple-bordered-box .k-header.k-tabstrip
{
    background:transparent !important;
}


.left-side-section
{
    padding:0px 8px 0px 0px !important;
}


.right-side-section
{
    padding:0px 0px 0px 8px !important;
}

.blue-bordered-box .form-head
{
    background:#3598dc;
    padding:0px 10px !important;
    text-align:left !important;
    margin-bottom:15px;
}

.purple-bordered-box .form-head
{
    background:#8e5fa2;
    padding:0px 10px !important;
    text-align:left !important;
    margin-bottom:15px;
}


.form-head label
{

    color:#FFFFFF !important;
    font-size:16px;
}

.page-footer .page-footer-inner
{
    color:#98a6ba !important;
}

@media (max-width:991px)
{
    .left-side-section
{
    padding:0px 0px 0px 0px !important;
}


.right-side-section
{
    padding:0px 0px 0px 0px !important;
}

.blue-bordered-box
{
    margin-bottom:10px;
}

.purple-bordered-box
{
    margin-bottom:10px;
}

}
.s-textbox {
    text-indent: 0.16em;
    height:25px !important;
    color: #003f59;
    background-color: #FFFFFF;
    border: 1px solid #878788;
   border-radius: 4px;
    font-size: 100%;
    padding: 2px .3em;
}
.k-i-calendar
{
    margin-top:-5px !important;
}

.k-numerictextbox .k-link
{
    height:10px !important;
}

.k-numerictextbox .k-icon
{
    height:13px !important;
}

.k-datepicker, .k-numerictextbox {
    border: 0px !important;
    padding: 0px !important;
}

.k-picker-wrap, .k-numeric-wrap {
    background: #FFF !important;
    border: 1px solid #878788 !important;
}



select {
  font-size: 11.73px !important;
  font-family:Verdana;
  padding:2px .3em !important;
}




.deposit-checkbox
{
    margin-top:3px !important;
    margin-left:-1px !important;
}


#GridTable_grvEmployerPayrollDetail .k-numerictextbox .k-select
{
    display:none;
}

.Payroll-Header-Grid
{
    height:350px;
    float:left;
}

.Payroll-Header-Grid .GridHolder
{
    overflow-x:hidden;
}

select:disabled
{
    background:#FFFFFF;
    color:#003f59;
    border:1px solid #707070;
}

input[type='text']:disabled
{
     background:#FFFFFF;
    color:#003f59;
    border:1px solid #999999 !important;
}

.ui-widget, .ui-widget input, .ui-widget select, 
.ui-widget textarea, .ui-widget button{
    font-family: Verdana !important;
}

.ui-widget label{
    font-size: 13px;
}
table.s-grid th,.s-grid td {
    font-family: Verdana !important;
    font-size: 13px !important;
    border: 2px solid #acacac !important;
}

.ui-accordion-content.ui-widget-content{
    z-index: 0 !important;
}

.ui-accordion .ui-accordion-header{
    margin-top: 0px;
}

.ui-accordion .ui-accordion-content{
    overflow: hidden;
}

.k-panelbar{
    margin-bottom: 10px;
}

.k-panelbar .k-content{
    border: none;
    font-size: 13px;
}

.button{
    font-family: Verdana !important;
    font-size: 14px !important;
}

a.ErrorLink, a.ErrorLink:hover {
    color: red;
    cursor: text;
    text-decoration: none;
}

div[id*="wfmESSChangeEmployerPasswordMaintenance"] span.ui-state-hover{
    background: #D5D5A7 !important;
}

.ui-accordion .ui-accordion-header .ui-accordion-header-icon{
    margin-top: 3px;
    left: auto;
}

.showrefreshbtn{
    display: block !important;
}

#lblFileFormat,#hlnkDownloadInstructions{
    font-size: 11.73px;
    color: #337ab7 !important;
}
#lblFileFormat:hover,#hlnkDownloadInstructions:hover{
    color: #23527c !important;
}

.ui-widget input[type=text], .ui-widget select{
    font-size: 11.733px !important; 
} 

label{
    font-size: 13px !important;
}

.s-gridparent.s-grid-container {
    width: 100%;
}

.page-link.next, .disabled .current.next{
    background-position: 5px -13px !important;    
}

.page-link.lastPage,.disabled .current.lastPage{
    background-position: 5px -77px !important;
}

.page-link.prev,.disabled .current.prev{
    background-position: 5px -44px !important; 
}

.page-link.firstPage,.disabled .current.firstPage{
    background-position: 5px -108px !important; 
}

.s-pager .disabled .next,.s-pager .disabled .prev,
.s-pager .disabled .firstPage,.s-pager .disabled .lastPage{
    background-image: url(../Styles/Kendo/BlueOpal/sprite.png)!important; 
    opacity: 0.5;
    text-indent: -850px;
}

.s-pager .page-link.prev, .s-pager .page-link.next,.s-pager .page-link.firstPage,.s-pager .page-link.lastPage{
    background-image: url(../Styles/Kendo/BlueOpal/sprite.png)!important; 
    text-indent: -850px;
}

.s-pager span,.s-pager a{
    height: 13px;
}

.s-grid-container .s-pager.light-theme .current {
    background-color: #2f8db4;
    background-image: none;
    border: 1px solid #DDDDDD;
    box-shadow: none;
    cursor: default;
}

.s-pager.simple-pagination{
    border: 1px solid #aaaaaa;
    padding: 5px !important;
}

.page-link{
    border: 1px solid transparent !important;
    background: none !important;
}

.page-link:hover {
    background-image: none !important;
    background-color: #9bb4be !important;
    border: 1px solid #DDDDDD !important;
    color: #333333;
}
.s-pager .page-link.prev, .s-pager .page-link.next,
.s-pager .page-link.firstPage,.s-pager .page-link.lastPage{
    border: 1px solid #bbb !important;    
    border-radius: 0px !important;
}

.s-pager .ellipse input {
    width: 2em;
    padding: 0px !important;
    margin-bottom: 3px !important;
}

.s-pager .ellipse{
    margin-bottom: 3px !important;
}

#Table_GridTable_grvChallengePhrase th,
#GridTable_idsfwGridView .s-grid th,
#wfmESSFileDtlLookup .s-grid th{
    background: #2F5980 !important;
}

#Table_GridTable_grvChallengePhrase input.GridTextBox{
    width: 80% !important;
}

table th.s-row-select-th{
    width: 32px !important;
}

.page-header-fixed .page-container {
    margin-top: 70px !important;
}
.page-header.navbar.navbar-fixed-top {
    background: #fff;
    border: 2px solid #000;
    border-bottom: 3px solid #000;
}
#ContentSplitter .k-panelbar-collapse, #ContentSplitter .k-panelbar-expand {
    top: 15%;
}
.blue-bordered-box .k-content {
    padding: 0 10px !important;
    box-sizing: border-box;
}

.k-widget.k-window.k-display-inline-flex{
    padding-top: 28.064px;
}

.k-widget.k-window.k-display-inline-flex .k-window-titlebar.k-hstack {
    margin-top: -28.32px;
    background: #d9ecf5;
    color: #00435e;
    border-bottom: 1px solid #a3d0e4;
}

.k-window-titlebar .k-window-actions.k-hstack .k-button.k-icon-button.k-window-action {
    border: 0;
    background: transparent;
}

ul.s-ulControlPanelbar.k-panelbar {
    border: 1px solid #AAAAAA;
    background-color: #fff;
    font-size: 8.8pt;
    float: left;
    width: 100%;
}

.ChallengeQuestionPnl .k-content.k-panelbar-content {
    float: left;
    width: 100%;
}

@media only screen and (max-width: 991px) {
    .navbar-toggle {
        display: block !important;
    }
    .page-header-fixed .page-container {
        margin-top: 0px !important;
    }
    .navbar-toggle {
        padding: 9px 0px !important;
        margin-right: 0px !important;
    }
    .ess-external-wizard .portal-head {
        float: left;
        text-align: center;
        font-size: 1.5em;
        padding: 10px 0;
        margin: 20px 0;
        width: 100%;
    }
    .ess-external-wizard .page-logo img {
        max-width:45%;
    }
}
/**/
/*ess-external-wizard*/
.ess-external-wizard {
    background: none !important;
}

    .ess-external-wizard .ProgressBar li:before {
        line-height: 42px !important;
    }

    .ess-external-wizard .portal-head {
        text-align: center;
        font-size: 24px;
        padding: 10px 0;
    }

    .ess-external-wizard .note-editable.panel-body {
        background: #fff !important;
    }

    .ess-external-wizard .MsoBodyText a:hover {
        text-decoration: none;
    }

    .ess-external-wizard .page-header.navbar.navbar-fixed-top {
        border: 0 !important;
    }

    .ess-external-wizard .ProgressBarDivParent {
        padding-top: 36px;
    }

    .ess-external-wizard .crumDiv {
        width: 98%;
    }

    .ess-external-wizard .ProgressBar li:before {
        background: #eee;
    }

.ProgressBar .ProgressDone .stepSpan {
    color: #999 !important;
}

.checkbox-with-txt {
    display: flex;
}

.ess-external-wizard .page-logo {
    padding: 20px !important;
}
.ess-external-wizard #MiddleSplitter {
    overflow-x:hidden !important;
}

.ess-external-wizard .ProgressBar li:before {
    line-height: 34px !important;
}
.ProgressBar span {
    line-height: 50px !important;
    margin-left: 20px;
}
.additional-wizard .breadcrumb-page-info {
    display:none;
}
.panel-heading .literal {
    font-size: 16px;
}
/*Validation Error*/

.ess-external-login .s-textbox,
.ess-external-login .hasDatepicker,
.ess-external-login select,
.ess-external-wizard .s-textbox,
.ess-external-wizard .date-picker,
.ess-external-wizard select,
.ess-external-wizard .hasDatepicker{
    height: 30px !important;
    width: 200px;
    padding: 6px;
}

.validator-error {
    color: #FF0000;
}

.input-error {
    display: flex;
    flex-direction: column;
}

.validator-error {
    color: red;
    order: 2;
}

.input-error br,
.input-erro-with-txt br {
    display: none;
}

.input-erro-with-txt {
    display: flex;
    flex-direction: column;
}

    .input-erro-with-txt label {
        order: 3;
    }

.pagedate-display-order {
    width: 200px;
    display: flex;
    flex-direction: column;
}

    .pagedate-display-order .date-picker,
    .pagedate-display-order .hasDatepicker {
        display: flex;
        flex-wrap: wrap;
        position: relative;
        width: 200px;
        height: 30px !important;
    }

    .pagedate-display-order .validator-error {
        order: 3;
        white-space: nowrap;
    }

    .pagedate-display-order .ui-datepicker-trigger {
        right: 6px;
        top: 6px;
    }

/*Security WPSMaintenance*/
.security-wizard-legend,
.security-wizard-legend label {
    display: block !important;
    font-size: 16px !important;
    float: left;
    border-bottom:none !important;
}
.one-time-passcode label {
    width: 170px;
    float: left;
    text-align: left !important;
}

.one-time-passcode input[type="text"] {
    width: 200px;
    height: 25px !important;
}

.one-time-passcode input[value="Activate"] {
    margin-left: 170px;
}

.one-time-passcode div {
    display: flex;
}
/*Media screen Responsive*/
@media screen and (max-width:910px) {
    .mss-external-login .s-textbox,
    .mss-external-login .hasDatepicker,
    .mss-external-login .date-picker,
    .mss-external-login select {
        width: 100% !important;
    }
    .one-time-passcode input[value="Activate"] {
        margin-left: 0;
    }

    .one-time-passcode div {
        display: unset;
    }
}
/*ess-external-wizard*/
.ess-external-wizard .breadcrumb-page-info {
display:none;
}
.heading-register {
    font-size: 16px;
    margin-bottom: 10px;
}
.ess-external-wizard .portal-head {
    text-align: center;
    font-size: 24px;
    padding: 10px 0;
    width: calc(100% - 234px);
}
.ess-external-wizard .ProgressBar span {
    line-height: 50px !important;
}
.ess-external-wizard .stepContainer .k-panelbar > .k-item > .k-link,
.ess-external-wizard  .s-spnControlPanelbar.panel-heading {
    font-size: 16px;
    font-weight: 300;
    background: #3598dc !important;
    color: #fff !important;
    text-align: left !important;
    margin-bottom: 0px;
}
.ess-external-wizard .s-ulControlPanelbar {
    border: 1px solid #3598dc !important;
    width:100% !important;
    float:left;
}
.ess-external-wizard ul.s-ulControlPanelbar.k-panelbar {
    border: 1px solid #3598dc !important;
    background-color: #fff;
    font-size: 8.8pt;
    float: left;
    width: 100%;
}

.ess-external-wizard .s-liControlPanelbar {
    list-style-type: none;
    display: block;
    border-width: 0;
    margin: 0;
    zoom: 1;
    border-radius: 0;
}
.ess-external-wizard  .panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    font-size: 16px;
    border-bottom: 1px solid #ccc;
    width: 100%;
    display: block;
    margin-bottom: 20px;
}
.ess-external-wizard div#tblStep111 {
    float: left;
    width: 100%;
}
.ess-external-wizard .s-legendPanelbar:empty {
    border: 0 !important;
}
.ess-external-wizard ul li {
list-style-type:none !important;
}
.ess-external-wizard .s-legendPanelbar {
    border: none !important;
}
/*collapsable-custom-panel*/
.custom-collapsable-panel .s-liControlPanelbar {
    background: #3598dc !important;
    text-align: left !important;
    margin-bottom: 15px;
    line-height: 30px;
}

    .custom-collapsable-panel .s-liControlPanelbar.panel-background .panel-heading,
    .custom-collapsable-panel .s-liControlPanelbar.panel-background .panel-heading:hover,
    .custom-collapsable-panel .s-liControlPanelbar.panel-background .panel-heading.ui-state-active,
    .custom-collapsable-panel .s-liControlPanelbar .ui-state-active {
        color: #FFFFFF !important;
        font-size: 16px;
        padding: 0 10px !important;
        border: 1px solid #3598dc;
        background: #3598dc !important;
    }

.custom-collapsable-panel .s-divControlPanelContainer {
    border-width: 0 1px 1px 1px;
    width: 100% !important;
    padding-bottom: 20px;
    border-style: solid;
    border-color: #3598dc !important;
}
.ess-external-wizard .ProgressBar span {
    font-family: Verdana !important;
    font-weight: normal !important;
    font-size: 14px !important;
    margin-left: 25px;
}
.regular-font,
.regular-font span {
    font-size: 14px;
}
.radio-button-with-label {
display:flex;
align-items:center;
gap:6px;
height:30px;
}
/*remove crumdiv*/
.additional-wizard .crumDiv,
.changepassword .crumDiv,
.changeUsername .crumDiv,
.essUseregistrationWizard .crumDiv,
.ForgotPassword .crumDiv,
.ForgotUsername .crumDiv,
.SecurityWPSMaintenanceWizard .crumDiv,
.mssUserRegistrationWizard .crumDiv,
.mss-external-wizard .crumDiv,
.ess-external-wizard .crumDiv {
    display: none !important;
}
/*Counter for Wizard*/
.essUseregistrationWizard .ProgressBar {
    counter-reset: custom-counter 0;
}
    .essUseregistrationWizard .ProgressBar li {
        counter-increment: custom-counter;
    }
        .essUseregistrationWizard .ProgressBar li:before {
            content: counter(custom-counter)
        }

/**/
.ForgotUsername span.s-spnControlPanelbar.panel-heading.k-link.k-header.k-state-selected {
    display: block !important;
    background: #3598dc !important;
    margin-bottom: 0;
    color: #fff !important;
    height: 32px;
    line-height: 32px;
}
.changepassword .custom-collapsable-panel .s-spnControlPanelbar.k-link.k-header.k-state-selected {
    display: block !important;
    background: #3598dc !important;
    margin-bottom: 0;
    color: #fff !important;
    height: 32px;
    line-height: 32px;
    font-size: 16px !important;
}
.txt-nowrap {
    white-space:nowrap !important;
}
.additional-wizard .header-inner,
.changepassword .header-inner,
.changeUsername .header-inner,
.essUseregistrationWizard .header-inner,
.ForgotPassword .header-inner,
.ForgotUsername .header-inner,
.SecurityWPSMaintenanceWizard .header-inner,
.mssUserRegistrationWizard .header-inner,
.mss-external-wizard .header-inner,
.ess-external-wizard .header-inner{
    border-bottom: 1px solid #ccc !important;
}
.ess-external-wizard .heading-register {
    display: block !important;
    background: #3598dc !important;
    margin-bottom: 0;
    color: #fff !important;
    height: 32px;
    line-height: 32px;
    font-size: 16px;
    padding-left: 10px;
}
.margin-bottom-0 {
margin-bottom:0 !important;
}
.margin-top-10 {
margin-top:10px !important;
}
/*changeusername*/
.changeUsername .custom-collapsable-panel ul li .s-spnControlPanelbar.k-link.k-header.k-state-selected {
    color: #FFFFFF !important;
    font-size: 16px;
    padding: 0 10px !important;
    border: 1px solid #3598dc;
    background: #3598dc !important;
}
/**/
.changepassword .custom-collapsable-panel .s-ulControlPanelbar,
.changeUsername .custom-collapsable-panel .s-ulControlPanelbar {
    list-style-type: none;
}

    .changepassword .custom-collapsable-panel .s-ulControlPanelbar .s-spnControlPanelbar,
    .changeUsername .custom-collapsable-panel .s-ulControlPanelbar .s-spnControlPanelbar {
        font-size: 16px;
        color: #fff;
        padding-left: 10px;
    }

    .changepassword .custom-collapsable-panel .s-ulControlPanelbar .s-divControlPanelContainer,
    .changeUsername .custom-collapsable-panel .s-ulControlPanelbar .s-divControlPanelContainer {
        float: left
    }
/**/
/*Media screen Responsive*/
@media screen and (max-width:932px) {
    .s-textbox, .hasDatepicker, .date-picker select {
        height: 25px !important;
        width: 100% !important;
        padding: 2px;
    }

    .one-time-passcode input[value="Activate"] {
        margin-left: 0;
    }

    .one-time-passcode div {
        display: unset;
    }
    .ess-external-wizard .ProgressBarDivParent {
    padding-top:0;
    }
    .ess-external-wizard .page-header + .page-container {
        margin-top: 10px !important;
    }
    .ess-external-wizard .portal-head {
        width: 100%;
        padding-bottom:0;
        margin-bottom:0;
    }

    .SecurityWPSMaintenanceWizard .form-verticle-align {
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .one-time-passcode {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
   
}
/**/
.ess-external-wizard .preloader {
    background: rgba(0,0,0,.3) url(../images/loader.gif) no-repeat center center !important;
}
.theme-panel.hidden-xs.hidden-sm {
    margin-top: -18px !important;
    right:16px;
}