@media (max-width: 767px) {
    #mainHeader_mob > section {
        position:relative;
        z-index:1;
    }
.back-ntn { float: right; border: none; font-size: 20px;   }
.mobile-view {position: relative; }
.mobile-header {background:#ec1c24; padding: 10px 0; }
.mobile-back,
.mobile-nav {color: #fff; padding:0 20px; vertical-align: middle; font-size: 20px;  }
.header-action {float: right; margin:0;}
.header-action li { vertical-align: middle; }
.header-action a {vertical-align: middle; font-size: 20px; color: #fff; }
.header-action a .glyphicon {padding: 15px 5px;}
.exide-logo {width:150px; height: auto;}
.side-navigation {position: fixed; width:250px;  left:-250px; top: 0; background: #fff; height: 100%; overflow: auto; z-index:9;   -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out;  -o-transition: all .3s ease-in-out;  transition: all .3s ease-in-out; }
.side-navigation.open { left: 0;  box-shadow: 0 0 10px 2px #333333; -o-box-shadow: 0 0 10px 2px #333333; -webkit-box-shadow: 0 0 10px 2px #333333; background:#2c343f; }
.overlay {background:rgba(0,0,0,.5);position: fixed; top:0; left:0;  width: 100%; height: 100%;z-index:2;}
.user-info {padding: 11px 10px; background:#f2f2f2;}
.user-info p {margin-bottom: 3px;    }
#UserName {font-weight: 600;}
.logout-btn {padding:0 25px 0 15px; display: block; color: #fff; font-size:20px; }
.red-bg {background:#ec1c24; }
.list-area li {background: #fff; padding: 10px; border-bottom:1px solid #c6c6c6;  font-family: 'Open Sans';}
.list-area li:nth-child(2n) { background:#f1f1f1;    }
.list-area .list_date { font-weight: bold; width: 82px; color: #255cca; }
.list-area li.selected {background: #ddd;    }
.list-area li h4 {font-weight: 600; margin-top: 0; }
.list-area li p { margin-bottom: 3px; }
.media-list.list-area li .media-right { text-align: center; }
.media-list.list-area li .media-right a { display: block; padding: 10px; font-size: 20px; color:#5a5a5a; vertical-align: middle; cursor: pointer;}
.list-area .media { margin-top:0;}
.grid-list label {color: #333; font-weight: bold; font-size: 14px; margin-top: 10px;}
.modal-title {font-weight: 600;}
.grid-list > li {border-bottom: 1px solid #ddd;}
.grid-list > li:last-child{border-bottom: none; }
.fix-bottom {position: fixed; bottom: 20px; right:10px;}
.fix-bottom a {background: #ec1c24 none repeat scroll 0 0; cursor: pointer;   border: 2px solid #ffffff;   border-radius: 50%;   color: #ffffff;   font-size: 20px;   padding: 11px 12px 14px 13px; display: block;  }
.side-navigation ul { margin:0;    }
.side-navigation .panel-body { padding:0;  }
.sub-menu-list { display:block; padding-left:0px; margin:0; list-style-type:none; background:#252c36;}
.sub-menu-list li	{ display:block; float:left; clear:both; width:100%;  border-bottom: 1px solid #2c343f; background: #252c36;}
.sub-menu-list li a , .sub-menu-list li a:hover , .sub-menu-list li a:focus { padding:5px 10px; font-size:18px; display: flex; color: #ddd; text-decoration:none; width:100%;}
.sub-menu-list li a span, .sub-menu-list li a:hover span, .sub-menu-list li a:focus span , .menu-list-item span { font-size:14px;  align-self: center; -o-align-self: center; -webkit-align-self: center;}
.sub-menu-list li a.collapsed span, .sub-menu-list li a.collapsed:hover span, .sub-menu-list li a.collapsed:focus span , .menu-list-item.collapsed	span { transform:rotate(90deg);}
.sub-menu-link , .sub-menu-link:hover , .sub-menu-link:focus {color: #ddd;}

.page-title-mobile { text-align: center; padding: 10px; font-weight: 600; font-size: 20px; }


}
@media (max-width: 600px) {
    
	
}
@media (max-width: 400px) {
.exide-logo {width: 100px;  }
.header-action a { font-size: 16px;    }
.header-action a .glyphicon {  padding: 9px 3px;}
.mobile-back, .mobile-nav {font-size: 16px;   padding: 0 12px;    }
}