/* =============== Media Queries ================ */
@media screen and (min-width:768px) {
    .dsHide {display: none;}
}
@media screen and (max-width:1279px) {
	
}
@media screen and (max-width:1023px) {
	
	
}
@media screen and (max-width: 767px) {	
body {font-size: 12px;}
h2 {font-size: 14px;}
h6 {font-size: 12px;}

.card-style,
.card-style.him-card {
    position: relative;
    padding: 0px !important;
    background: #F7F7FA;
    box-shadow: 0px 0px 1px rgba(40, 41, 61, 0.08), 0px 0.5px 2px rgba(96, 97, 112, 0.16) !important;
    border-radius: 12px;
    margin-bottom: 20px !important;
    min-height: 150px;
}
.card-style .card-header,
.nOGBLHead.card-header {
    position: relative;
    display: flex;
    align-items: center !important;
    background: #62B1EA;
    padding: 3px 15px;
    border-radius: 12px 12px 0px 0px;
    min-height: 44px;
    margin: 0px !important;
}
.card-style .card-header h5 {
    font-weight: 700;
    font-size: 14px !important;
    line-height: normal !important;
    color: #fff !important;
    margin: 0px !important;
    padding: 0px !important;
    border: 0px !important;
}
.card-style .card-header .tab-row {
    color: #fff !important;
margin-bottom: -11px !important;
border-bottom: 0px !important;
}
.card-style  .form-control.space-tr-10{ margin: 10px 10px 0 0;}
.card-style .card-header.tab-row .tab-list{margin-bottom: -11px !important;}
.card-style .card-header .tab-row .tab-list>li>a,
.card-style .card-header.tab-row .tab-list>li>a{padding: 10px 5px !important; color: #fff!important;}
.card-style .card-header .tab-list>li{margin-right: 0px !important;}
.card-style .card-header .tab-row .tab-list>li.active>a, .card-style .card-header .tab-row .tab-list>li.active,
.card-style .card-header.tab-row .tab-list>li.active>a, .card-style .card-header.tab-row .tab-list>li.active{ background: #F7F7FA;border-radius: 6px 6px 0 0; color: #2A5EE3 !important;}
.card-style .card-header .tab-list>li.active>a:after,
.card-style .card-header.tab-row .tab-list>li.active>a:after{display: none;}
.card-style .card-header .tab-list>li+li,
.card-style .card-header.tab-row .tab-list>li+li{ margin-left: 0px !important;}
.card-style .card-header h6 i {
    vertical-align: middle !important;
}
.card-style .card-header h5 .gray-color{ color: #fff !important;}

.card-style .card-header a.din-Medium.noWrap{ color:#fff !important}

.card-style .card-header .profilepic img {
    width: 38px !important;
    height: 38px !important;
}

.card-style .card-header .emppicdetails {
    margin-left: 0 !important;
}
.card-style .card-body {
    padding: 15px;
    background: #F7F7FA !important;
}
.card-style .card-body.row{ margin-left: 0px !important; margin-right: 0px !important;}
.bor-radius-all,
.card-style.bor-radius-all,
.card-style.bor-radius-all .card-body {
            border-radius: 12px !important;
        }

.card-style .leaderboardCard .him-card{display: inline-block; margin: 10px !important; width: calc(100% - 20px); box-shadow: none !important; }

.card-style.learning-module .card-header{ background: #57D1E1 !important;}
.card-style.attendance-module .card-header{ background: #FFB531 !important;}

.card-style.hris-module .card-header{ background: #4987F3 !important;}
.card-style.attendance-module .card-header{ background: #FFB531 !important;}





.leaderboardCard.card-body .him-card img{ margin-top: 30px;}
.bor-bottom{ border-bottom: 1px solid #C7C9D9;}
.topBorderHd h4{border-bottom: 0px !important;}
.mbflexWrap {
        flex-wrap: wrap!important;
        justify-content: center;
}
.him-card.centerAndMiddleDiv{left: 10px; right: 10px;}
.mbJustifyContentFlexEnd {justify-content: flex-end;}

.mob-emp-card .mob-empPic{ min-width: 45px !important;}
.logo_outer img {
    max-width: 120px;
    max-height: 43px;
}
.empProfilePic, .empProfilePic img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
}
.him-card.badgeCard{ width: 100% !important;}
.card-style.him-card .card-header.flex-wrap{ flex-wrap: wrap; padding-bottom: 5px;}
.card-style.him-card .card-header.flex-wrap h5{ margin-bottom: 10px !important;}
.empName h5 {
    margin-bottom: 0px;
    margin-top: 5px;
    font-size: 13px;
}
.topBorderHd h4 {font-size: 16px;}
.empPic, .empPic img {width: 45px; height: 45px;}
.mb-d-flex {display: flex; margin-bottom: 10px;}
.mbmargin2 {
    margin-bottom: 2px;
}
.tableHead {font-size: 11px;}
.mbHide, .material-icons.infoIcon {display: none!important;}
.mb10 {
    margin-bottom: 10px!important;
}
.border-bottom {
    border-bottom: none;
    padding: none;
}
.learningSrcoll span.dsHide.mbhdtd {
    margin-bottom: 4px;
    display: block;
    font-size: 11px;
    color: #8a8a8a;
}
.centerAndMiddleDiv img {
    width: 80px!important;
}
.centerAndMiddleDiv{width: auto!important;}
.learningSrcoll {
    max-height: 310px!important;
}
.padding15.mbPadding0 {
    padding: 0px;
}
.centerAndMiddleDiv h2 {font-size: 30px!important;}
.mb-border-bottom {border-bottom: 1px solid #eee;}
.main-container {
    padding: 0 2.5px 0 2.5px;
 } 
 .mbMarginRight {margin-right: 10px;}
 h6.din-bold {
    font-family: 'DIN Medium';
}
.card-header h5 {font-size: 13px;}
.tab-list>li>a {font-size: 10px; white-space: nowrap;}
.him-card {margin-bottom: 20px;}
.tableBody {font-size: 11px;}
.tab-list   { display: flex;
overflow-x: auto;
overflow-y: hidden;
}
body ::-webkit-scrollbar:vertical, .modal-content ::-webkit-scrollbar:vertical {
    width: 8px;
}

body ::-webkit-scrollbar:horizontal, .modal-content ::-webkit-scrollbar:horizontal {
    height: 8px;
}
.marginTop20 {margin-top:0px}
label.goal-name, .textElipis {white-space: pre-wrap;}
.firstRowCard {
    min-height: auto;
    max-height: initial;
}
.academicScroll {
    max-height: 150px;
    min-height: auto;
}
.noDataCard .him-d-flex {justify-content: center;}
h5.din-bold {
    font-size: 13px;
    font-family: 'DIN Medium';
}
.him-card.lastRowCard {height: auto;}
.itemIcon {
    width: 21px;
}
.itemDateCricle {margin-right: 15px;}
.itemDateCricle {
    width: 50px;
    height: 50px
}
.him-d-flex.milestoneBudge img {
    width: 9px;
    margin-right: 5px;
}
.mbHide {
    display: none;
}
.mbmargin2 {margin-bottom: 2px!important;}
.leaderboardPicCenter, .leaderboardPicCenter img {
    width: 50px;
    height: 50px;
}
.leaderBoardEmp .empCode{
    margin-top: 2px;
}
.leaderBoardEmp h6 {
    flex-wrap: wrap;
}
.leaderBoardEmp .empName {font-size: 12px;}
.leaderboardPic, .leaderboardPic img {
    width: 30px;
    height: 30px;
}
h3.leaderboardname {font-size: 12px;}
.leaderBoardTableScroll h5 {
    font-size: 13px;
}
.leaderboardCard .tableBodyRow .gray-color {
    white-space: initial;
}
.actionDropdownMenu {width: 300px;}
button.btn.btn-border {width: 45%;}
.dateFilterButton {width: 150px;}
.orgChartPic, .orgChartPic img {
    width: 40px;
    height: 40px;
}
}

 
@media screen and (max-width: 413px) {
	

    
}