body,html,.row-offcanvas {
  height:100%;
}

#sidebar {
  width: inherit;
  min-width: 220px;
  max-width: 220px;
  background-color:lightgrey;
  float: left;
  height:100%;
  position:relative;
  overflow-y:auto;
  overflow-x:hidden;
  /*box-shadow:-3px 13px 15px #000;*/
}
#main {
  height:100%;
  overflow:auto;
  padding-top:60px;
}

/*
 * off Canvas sidebar
 * --------------------------------------------------
 */
@media screen and (max-width: 768px) {
  .row-offcanvas {
    position: relative;
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
    width:calc(100% + 220px);
  }
    
  .row-offcanvas-left
  {
    left: -220px;
  }

  .row-offcanvas-left.active {
    left: 0;
  }

  .sidebar-offcanvas {
    position: absolute;
    top: 0;
  }
}

/*-------------Pratik Shrestha-------*/
ul.nav-pills{padding:0; margin:0;}
.nav-pills li{width:100%;}
.nav-pills li.active{position:relative; font-weight: bold;}
.nav-pills li.active:after
{
  content:''; 
  width:0; 
  height:0; 
  border-top:10px solid transparent;
  border-right:10px solid #fff;
  border-bottom:10px solid transparent;
  border-left:10px solid transparent;
  position:absolute;
  right:0;
  top:12px;
}
.nav-pills>li>a{width:100%; background:transparent; padding:10px 15px; border-bottom:1px solid darkgrey; float:left; color:#2d2d2d; text-decoration: none;}
.nav-pills>li>a:hover{background:#2d2d2d; color:white;}
h1{font-size:20px; background:#1A3E74; line-height:60px; height:60px; color:white; padding:0 10px; margin:0; text-align:center;}
.nopadding{margin:0; padding:0;}

.navbar{background:#8B0000; height:60px; line-height: 60px; position:fixed; top:0; width:100%; z-index:999;}

.navbar-toggle .icon-bar{ background-color: #fff;}
ul.topmenu{float:right; position:relative; right:220px;}
ul.topmenu li{margin:0 10px;}
ul.topmenu li a{text-decoration:none; color:white;}
ul.topmenu li a:hover{text-shadow:0px 0px 7px #fff;}

.profileform{border:1px solid #ccc; margin-top:15px; padding:20px; margin-bottom:20px;}

.formheader{text-align: center; color:red;}
.emblem img{width:150px; height:150px; margin:20px auto; float:right;}
.formheader h2{margin:10px 0; font-size:30px; padding-top:10px;}
.formheader h3{margin:10px 0; font-size:24px;}
input{border:none; border-bottom:1px dashed #ccc; margin:0 10px; outline:none; background:transparent;}
input[type="text"]{min-width:380px;}
input[type="text"].med-input{min-width:240px;}
.visible-xs button{margin-top:10px; background:red; border:none; display:none;}
.visible-xs button:hover{box-shadow:0 0 15px #2f2f2f; background:red;}

.tablewrapper{width:100%; overflow-x:scroll; margin-bottom:20px;}
table.memberData{width:1560px; border-collapse: collapse;}
.memberData th{text-align:center; padding:5px 0; background:#ccc;}
.memberData td{padding:5px 10px;}
.memberData input[type="text"]{min-width:250px;}

.checkholder input[type="radio"]{float:left; margin-top:7px;}
.checkholder{width:100%; float:left; height: 30px; vertical-align: middle;}
.checkholder span{float:left; vertical-align: top; line-height: 30px;}

.profileform select{max-width: 140px;}
.addIcon, .delIcon, .editIcon{float:left; width:24px; height:24px; margin:0 10px; opacity:0.75;}
.addIcon:hover, .delIcon:hover, .editIcon:hover{cursor:pointer; opacity:1;}
.addIcon{background:url('../images/addRowIconSet.png') no-repeat top left; background-size:cover;}
.delIcon{background:url('../images/addRowIconSet.png') no-repeat top right; background-size:cover;}
.editIcon{background:url('../images/editRowIconSet.png') no-repeat top left; background-size:cover;}

.endRow{margin-bottom:20px;}

.stepNavigation{background:rgb(202, 240, 255); margin-top:10px; border-radius:4px; padding-top:5px; padding-bottom:5px;}
.stepNavigation a{float:left; width:auto; padding:8px 15px; background:#3c3c3c; color:white; margin:5px 15px; text-decoration:none; border-radius:5px;}
.stepNavigation a:hover{background:#1A3E74;}
a.stepCounts{border-radius:50%;}
a.inactiveStep{background:gray;}
a.inactiveStep:hover{background:gray; cursor:default;}
button.saveStep{background:#3c3c3c; padding:8px 15px; border:none; color:white; border-radius:5px; margin:5px 15px;}
button.saveStep:hover{background: green; cursor:pointer;}
a.currentStep{background:#1A3E74;}

button.saveStepOnly{background:green; padding:8px 15px; border:none; color:white; border-radius:5px; margin:5px 15px; float:right;}
button.saveStepOnly:hover{background: darkgreen; cursor:pointer;}

/*.tablewrapperNXT{position:relative; width:100%; height:240px; overflow-y:scroll;}*/
.tablewrapperNXT{margin:10px 0 20px 0;overflow-x:auto; width:100%;}
.customTables{width:100%;}
.customTables th{padding:5px; text-align: center; background:#3c3c3c; color:white;}
.customTables td{border:none; padding:5px; border-right:1px solid #ccc;}
.customTables td:last-child{border-right:none;}
.customTables tr.firstTRow{border-top:1px solid #ccc;}
.headrow{background: #9c9c9c;}
input.sm-input{max-width:170px !important; min-width:170px !important;}
.tac{text-align:center;}
.allLines td{border-bottom:1px solid #ccc;}
.allLines tr:last-child td{border-bottom:none;}

.listTable tr td{text-align:center;}
.listTable tr td:first-child{border-left:1px solid black;}

#loginPage{background:url('../images/background.png') no-repeat top center; background-size:cover; overflow-x:hidden; background-attachment: fixed;}
.loginForm{display:block; margin:100px auto; width:500px; background:rgba(255, 255, 255, 0.54); border-radius: 7px; padding:30px;}
.loginForm input{background:white; border:1px solid #ccc; margin:20px 0; padding:8px 10px; width:100%; border-radius:5px; min-width:80px;}
.loginBtn{font-weight:bold; width:200px; margin:10px auto; padding:10px 20px; display:block; border-radius: 5px; border:1px solid darkgreen; background:green; color:white;}
.loginBtn:hover
{
  cursor:pointer; 
  background:rgb(35, 182, 4);
  border:1px solid rgb(35, 182, 4);
  box-shadow: 0px 0px 30px #3c3c3c;
  -webkit-box-shadow: 0px 0px 30px #3c3c3c;
  -moz-box-shadow: 0px 0px 30px #3c3c3c;
  -o-box-shadow: 0px 0px 30px #3c3c3c;
}
.logocontainer{display:block; width:100%; text-align:center;}
.logocontainer img{width:150px; height:150px;}

.chartHeading{font-size:20px; color:#3c3c3c; margin-top:5px;}
canvas{padding:20px; background:#f5f5f5; margin:10px 0;}
.customDrop{background:#fff; border:1px solid #fff; width:200px; padding:8px 10px;}
.customDropLong{background:#fff; border:1px solid #fff; width:400px; padding:8px 10px;}
.readMoreArea{text-align: right; width:100%; float:left;}
.readMoreArea a{background:#3c3c3c; padding:5px 10px; color:#fff; font-weight:normal; font-size:14px; border-radius:0 0 5px 5px;} 
.readMoreArea a:hover{text-decoration:none; color:skyblue;}
.page-title{font-size:20px; background:#1A3E74; line-height:40px; height:40px; color:white; padding:0 10px; margin:0; text-align:center;}
.stripRows tr:nth-child(even){background:#f5f5f5;}
.stripRows tr td{text-align: center;}
.inputWardNo{width:70px;}

@media only screen and (max-width: 768px) {
.visible-xs button{display: block;}
ul.topmenu{right:0;}
.emblem img{float:none;}
.emblem{text-align: center;}
.headerTime{display:none;}
.loginForm{width:300px; margin:10px auto;}
}
@media only screen and (max-width:1000px){
  .headerTime{display:none;}
}