@font-face 
{
  font-family: 'Poppins-Regular';
  src: url('../fonts/Poppins-Regular.TTF');
  src: local("?"), url('../fonts/Poppins-Regular.woff') format("woff"), url('../fonts/Poppins-Regular.TTF') format("truetype"); 
}

@font-face 
{
  font-family: 'Poppins-SemiBold';
  src: url('../fonts/Poppins-SemiBold.TTF');
  src: local("?"), url('../fonts/Poppins-SemiBold.woff') format("woff"), url('../fonts/Poppins-SemiBold.TTF') format("truetype"); 
}

@font-face 
{
  font-family: 'MTCORSVA'; class="ErrorMsg"
  src: url('../fonts/MTCORSVA.TTF');
  src: local("?"), url('../fonts/MTCORSVA.woff') format("woff"), url('../fonts/MTCORSVA.TTF') format("truetype"); 
}

::-moz-selection{color:#fff; background:#43b7e2;}
::selection{color:#fff; background:#43b7e2;}

html, body{font-family:Poppins-Regular, Calibri, Arial; font-size:13px; color:#666; background-color:#f7f7f7; margin:0; padding:0;  height:97%;}

#container{min-height:100%; position:relative;}

.page-title{width:100%; margin:10px 0 15px; padding:0;}
.page-title h1{font-size:24px; margin:0; padding:0; float:left; color:#333;}
.page-title h1 .fa{margin:0 5px 0 0;}

.card{position: relative; background:#ffffff; padding:15px 0; height:auto; /*box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2); transition: all 0.3s ease-in-out;*/margin-bottom: 60px; border-radius:5px; min-height:480px;}

/*--------------------- Start Buttons CSS --------------------*/
.VioletBtn{background:#43b7e2; color:#fff; text-transform:none; outline:none; text-align:center; transition:all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; margin:0; text-transform:uppercase; border:none; padding:6px 20px; margin:0 5px 0 0;}
.VioletBtn:hover{background:#229ecc; color:#fff; outline:none;}
.VioletBtn:focus{background:#229ecc; color:#fff; outline:none !important;}
.VioletBtn .fa{margin:0; cursor:pointer;}

.btn-primary{background:#43b7e2; color:#fff; text-transform:none; outline:none; text-align:center; transition:all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; margin:0; text-transform:uppercase; border:none; padding:6px; margin:0 5px 0 0;}
.btn-primary:hover{background:#229ecc; color:#fff; outline:none;}
.btn-primary:focus{background:#229ecc; color:#fff; outline:none !important;}
.btn-primary .fa{margin:0; cursor:pointer;}

/*----------------- End Buttons CSS --------------------*/

/*---------------  Start Input Style -------------------*/
.FormSection .h4{color:#43b7e2; padding:0 0 5px; border-bottom:1px solid #43b7e2; margin:10px 0;}
.FormSection .col-md-3{margin:0 0 15px;}
.FormMinHeight{min-height:400px;}
.FormLabel{font-size:12px; margin:0 0 5px; font-weight:normal; display:block;}
.SelectDropdown {position: relative; display:inline-block; float:left; width:100%}
.SelectDropdown select { padding:2px 30px 0 15px; margin:0 0 10px; height:30px; color:#999; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; background: #fff url(../images/SelectArow.png) 100% -3px no-repeat; outline:none; border:1px solid #e5e7e8; line-height: 20px; border-radius:5px; font-size:13px;}
.SelectDropdown select option{padding:5px 0 !important;}
.form-control{-webkit-box-shadow:none; box-shadow: none; height:30px; padding:5px 10px; margin:0 0 10px; border-radius:5px; margin:0 0 10px; border:1px solid #e5e7e8; color:#999; font-size:13px;}
.CalenderInput {width:100%; background: #fff url(../images/CalIcon.png) right center no-repeat; padding: 5px; margin:0 0 12px; border: 1px solid #ccc; outline: none; float: left; border-radius:5px; box-shadow: none; height: 30px; font-size:13px;}
.CalenderInput:focus{box-shadow:none; border: 1px solid #ccc;}
.form_datetime{margin:0 0 10px;}
.input-group-addon{background-color:#fff; border:1px solid #e5e7e8; color:#777;}
.ErrorMsg{color:#f56868; font-size:11px; margin:0; width:100%; float: left; position: absolute; bottom: -8px;}
.Table_ErrorMsg{color:#f56868; font-size:11px; margin:-8px 0 0; width:100%; float: left; position: relative;}
.table .form-control{margin:0;}
.table .AmountInput{text-align:right;}

.UploadBtn {width: 0.1px; height: 0.1px; opacity: 0; overflow: hidden; position: absolute; z-index: -1;}
.UploadBtn + label {max-width: 100%; font-size:16px; font-weight:normal; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; display: inline-block; overflow: hidden; padding:8px;}
.UploadBtn-1 + label {color: #999; font-size: 14px;}
.UploadBtn-1 + label .fa{margin:0;}
.UploadBtn-1 + label {border: 1px solid #ccc; background-color: #fff; padding: 0; border-radius:5px;}
.UploadBtn-1:focus + label, .UploadBtn-1.has-focus + label, .UploadBtn-1 + label:hover { border-color: #ccc;}
.UploadBtn-1 + label span, .UploadBtn-1 + label strong {padding:4px 10px;}
.UploadBtn-1 + label span {width: 160px; float:left; min-height: 30px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; vertical-align: top;}
.UploadBtn-1 + label strong {height: 30px; color: #fff; background-color: #43b7e2; font-weight: normal; font-size: 14px; width:90px; float: right; padding:5px 10px;}
.UploadBtn-1:focus + label strong, .UploadBtn-1.has-focus + label strong, .UploadBtn-1 + label:hover strong {background-color: #43b7e2;}

.CameraIcon{position:absolute; bottom:7px; right:7px; cursor:pointer;}
.CameraIcon input[type='file']{opacity:0; cursor:pointer; width:15px;  height:15px; font-size:0; position:absolute;}

.mandatory{color:#f00;}

/*---------------  End Input Style -------------------*/0

.Form_table th{padding:3px 5px;}
.Form_table td{padding:3px 5px;}

.input-group{margin:0 0 10px}
.input-group-addon{padding: 4px 12px;}



/*--------------- Start Checkbox CSS -------------------- */
.TableCheckboxMargin{margin:3px 0 0; float:left;}
.Checkbox{position:relative; padding-left:25px; margin-bottom:10px; cursor:pointer; font-size:12px; -webkit-user-select:none; -moz-user-select:none;   -ms-user-select:none; user-select:none;	color:#555;	font-weight:normal;}
.Checkbox input {position:absolute; opacity:0; cursor:pointer;}
.CheckboxCheckMark{position:absolute; top:0; left:0; height:16px; width:16px; background-color:#fff; border:1px solid #ccc; border-radius:3px;}
/*.Checkbox:hover input ~ .checkmark {background-color:#ccc;}*/
.Checkbox input:checked ~ .CheckboxCheckMark{background-color: #fff;}
.CheckboxCheckMark:after{content: ""; position:absolute; display:none;}
.Checkbox input:checked ~ .CheckboxCheckMark:after{display:block;}
.Checkbox .CheckboxCheckMark:after{left:5px; top:1px; width:5px; height:9px; border:solid #9674d3; border-width:0 2px 2px 0; -webkit-transform:rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}
.CheckDisable{background:#ccc !important; opacity:0.5; cursor:default;}
/*--------------- End Checkbox CSS -------------------- */

/*--------------- Start RedioBtn CSS -------------------- */
.RedioBtn{position:relative; padding-left:25px; margin:0 14px 0 0; cursor:pointer; font-size:12px; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; color:#555;	font-weight:normal;}
.RedioBtn input{position:absolute; opacity:0; cursor:pointer;}
.RedioCheckMark{position:absolute; top:0; left:0; height:16px; width:16px; background-color:#fff; border:1px solid #ccc; border-radius:50%;}
/*.RedioBtn:hover input ~ .RedioCheckMark{background-color:#18b5f6;}*/
.RedioBtn input:checked ~ .RedioCheckMark{background-color:#fff;}
.RedioCheckMark:after {content:""; position:absolute; display:none;}
.RedioBtn input:checked ~ .RedioCheckMark:after{display: block;}
.RedioBtn .RedioCheckMark:after {top:4px; left:4px; width:6px; height:6px; border-radius:50%; background:#43b7e2;}

/*--------------- End RedioBtn CSS -------------------- */

/*------------------ Start On Off Button CSS --------------------------*/
.InputSwitch .switch{position:relative; display:inline-block; width:35px; height:10px; margin: 10px 0 0 0;}
.InputSwitch .switch input{display:none;}
.InputSwitch .slider{position:absolute; cursor:pointer; top:0; left:4px; right:0; bottom:0; background-color:#c5c5c5; -webkit-transition:.4s; transition:.4s;}
.InputSwitch .slider:before{position:absolute; content:""; height:14px; width:14px; left:-4px; bottom:-1px; background-color:white; -webkit-transition:.4s; transition:.4s; box-shadow:0 1px 2px #bbb;}
.InputSwitch input:checked + .slider{background-color: #1abb9c;}
.InputSwitch input:focus + .slider{box-shadow: 0 0 1px #2196F3;}
.InputSwitch input:checked + .slider:before{-webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px);}
/* Rounded sliders */
.InputSwitch .slider.round{border-radius: 34px;}
.InputSwitch .slider.round:before{border-radius: 50%;}

.custom-checkbox .custom-control-label::before {width: 15px; height: 15px;}
.custom-control-input:checked ~ .custom-control-label::before {width: 15px; height: 15px;}
/*------------------ End On Off Button CSS --------------------------*/

/*--------------- Start Search Pannel --------------------*/
.SearchIcon{float:right; font-size:25px; line-height:16px; margin:0 20px; cursor:pointer;}
.SearchIcon .fa{margin:0; transform: rotate(0deg); transition: all 0.3s ease;}
.SearchIcon .fa.open{transform: rotate(180deg); transition: all 0.3s ease;}

.SearchPannel{width:100%; height:auto; padding:10px 0; background:#f7f7f7; display:block; border-radius:5px; margin:0 0 10px;}
.Search-control-Input {width:55%; background: #fff; padding: 6px; border: 1px solid #ddd; outline: none; float: left; border-radius: 0; box-shadow: none; height: 32px;}
.Search-control-Input:focus{box-shadow:none; border: 1px solid #ddd;}

.SearchCalenderInput {width: 55%; background: #fff url(../images/CalIcon.png) right center no-repeat; padding: 5px; border: 1px solid #ccc; outline: none; float: left; border-radius:0; box-shadow: none; height: 32px;}
.SearchCalenderInput:focus{box-shadow:none; border: 1px solid #ccc;}

.Searchdropdown {position: relative; display:inline-block; float:left; width:55%}
.Searchdropdown select { padding:5px; color: #444; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer; background: #fff url(../images/selectarow.png) 100% 0 no-repeat; outline:none; border:1px solid #ddd; line-height: 20px; border-radius:5px;}

.SearchBtn{width:auto !important; background:#1abb9c; float:left; border:none; border-radius:0; outline:none; margin:0 ; padding:1px 10px; outline:none; color:#3963af; width:auto; color:#fff; font-size:15px; transition:all 0.25s ease-in-out; -webkit-transition:all 0.25s ease-in-out; -moz-transition:all 0.25s ease-in-out; text-decoration:none; border-radius:5px;}
.SearchBtn:hover{background:#73879c; color:#fff;}
.SearchBtn:focus{outline:none;}

/*--------------- End Search Pannel --------------------*/

.ListTable{width:100%; height:auto; float:left; margin:0 0 15px;}
.ListTable .ListHead{background:#43b7e2 !important; color:#fff; font-weight:normal !important; border-bottom:1px solid #eee !important; }
.ListTable tr:nth-child(even){background: #fff; border-bottom:1px solid #eee;}
.ListTable tr:nth-child(odd){background: #f9f9f9; border-bottom:1px solid #eee;}
.ListTable tr td{padding: 3px;}

.ListTable .FileNeame{float:left; width:500px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
.ListTable .DataSet{float:left; width:130px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block;}
.table > thead > tr > th { border-bottom: none; font-weight:normal !important; vertical-align:top;}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{border-top:none;}
.ListTable .fa{margin:0;}

.ListTable .tbl-content{height:300px; overflow-x:auto; margin-top: 0px;}


.PayRoll{width:98%; height:350px; overflow-x:scroll;}
.PayRoll .table{width:2300px;}
.PayRoll .table th{vertical-align:top;}
::-webkit-scrollbar{width:4px; height:4px;} 
::-webkit-scrollbar-track{ background:transparent;} 
::-webkit-scrollbar-thumb{ background:#ccc;}
/*--------------- Start Tooltip CSS -------------------*/
.ActionIcon{color:#43b7e2; cursor:pointer;}
.ActionIcon a{color:#43b7e2; margin:0;}
.ActionIcon a:hover{color:#5885b3;}

.ActionIcon a.ActiveEmp{color:#69cc4a;}
.ActionIcon a.InActiveEmp{color:#dc3625;}

.tooltip {font-size:13px;}
.tooltip-inner {color:#fff; background-color:#43b7e2; text-align:justify; line-height:18px;}
.tooltip.right .tooltip-arrow {border-right-color: #43b7e2; border-width: 5px 5px 5px 0;}
.tooltip.bottom .tooltip-arrow {border-bottom-color: #43b7e2;}
.tooltipOne:after, [data-tooltip]:after{z-index:1000; padding:5px; width:300px; background-color:#43b7e2; color:#fff; content:attr(data-tooltip); font-size:15px; line-height 1.2; border-radius:5px;}
.tooltip-right:before{margin-bottom:0; margin-left:-12px; border-top-color:transparent; border-right-color:#43b7e2;}
.tooltip.top .tooltip-arrow{border-top-color:#43b7e2;}
.tooltip.left .tooltip-arrow{border-left-color:#43b7e2;}

.IconTooltip{position:relative; display:inline-block;}
.IconTooltip .tooltiptext{visibility:hidden; width:auto; background-color:#c52222; color:#fff; text-align:center; border-radius:5px; padding:2px 10px; position:absolute; z-index:1;  bottom:80%; left:50%; margin-left:-20px; font-size:12px;}
.IconTooltip .tooltiptext::after{content:""; position:absolute; top:100%; left:50%; margin-left:-5px; border-width:5px; border-style:solid; border-color:#c52222 transparent transparent transparent;}
.IconTooltip:hover .tooltiptext{visibility:visible;}
/* Tooltip container */

.pagination{margin:0;}
.pagination > li > a, .pagination > li > span{color:#523980;}
.pagination > .active > a:hover{background:#bba8dc; border-color:#bba8dc;}
.pagination > .active > a{background:#43b7e2; border-color:#43b7e2;}

.PL_letter{padding:0px;}
.PL_letter td{padding:8px;}

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

.table{border: 1px solid #eee;}

.EmpPhoto{width:150px; height:150px; margin:0 auto 10px;}
.EmpPhoto img{width:100%; border-radius:50%; border:3px solid #bba8dc; padding:3px;}
.EmpName{font-size:16px; font-weight:bold; text-align:center; color:#bba8dc;}
.EmpDesig{font-size:13px; text-align:center; margin:0 0 20px;}
.EditDetails{text-align:center; font-size:20px; width:auto; float:right;}
.EditDetails a{color:#bba8dc;}
.Status{color:#fff; background:#9fe07e; border-radius:3px; padding:2px 10px;}
.Status .fa{margin:0 5px 0 0; width:auto;}


.LedgerPopup{width:900px;}
.modal-title{font-size:24px; color:#333;}
.modal-header .close {margin-top: 8px;}

#footer{position:absolute; bottom:0; width:100%; height:30px; padding:0;}
.footer{text-align:center; font-size:11px;}



/*----------------- Start Color Theam ----------------*/
.ColorTheam-head{ color:#383838; width:100%; border-radius:0; margin:0; padding:5px 15px;}
.ColorTheam{width:auto; height:auto; margin:0 10px;}
.ColorTheam ul{margin:0; padding:0 15px;}
.ColorTheam li{width:15px; height:15px; list-style-type: none; border-radius:3px; display: inline-block; margin: 0; text-indent:-9999px;  cursor:pointer; padding:0;}
#Blue{background:#43b7e2;}
#Sky{background:#aecdd5;}
#Green{background:#67c18b;}
#Orange{background:#f15a29;}
/*----------------- End Color Theam ----------------*/

/*---------------- Start Salary Slip ----------------*/
.SalarySlipFormat{width:100%; border:2px solid #43b7e2; padding:10px; background:url(../images/WaterMark_logo.png);}
.SalaryStatementFormat{width:100%; border:2px solid #43b7e2; padding:10px;}
.SalarySlipHeader{width:100%; height:auto; border-bottom:1px solid #999; padding:0 0 10px; margin:0 0 10px; float:left;}
.ITPPLogo{width:150px; display:inline-block; margin:20px 0 0;}
.ITPPAddress{width:300px; display:inline-block;}
.SalarySlipHead{font-size:18px; text-align:center; margin:10px 0 30px; border-bottom:1px solid #999; padding:0 0 5px;}

.SalarySlipFormat .table{border:none; margin:0;}
.SalarySlipFormat .table td{padding:4px 0;}

.SalarySlipDetails{width:100%; height:auto float:left; margin:0 0 -4px;}
.SalarySlipDetails .SalaryDetailsTable{width:100%; height:auto; border:1px solid #999;}
.SalarySlipDetails .SalaryDetailsTable .SalaryDetailsHead{border-bottom:1px solid #999;}
.SalarySlipDetails .SalaryDetailsTable .SalaryDetailsHead th{padding:5px !important;}
.SalarySlipDetails .SalaryDetailsTable td{padding:5px !important;}
.SalaryTotal{border-bottom:1px solid #999; font-weight:bold;}
.NetPay{padding:8px; border:1px solid #999; border-top:none; font-weight:bold; }
.Rupees{padding:15px 0; }
.AuthSign{height:30px; border-bottom:1px solid #999; margin:0 0 5px;}
/*---------------- End Salary Slip ----------------*/


.cardbox-body{padding:15px;}
.cardbox .cardbox-title {
    border-bottom: solid 1px rgba(127, 137, 161, 0.3);
    font-size: 16px;
    padding:5px 10px;
    background-color:#f5f5f5;
}

.Preview_Section{border:1px solid #ccc; border-radius:5px; padding:0; box-shadow:0 0 10px #89d8f5;}

a .cardbox-title{color:#229ecc;}

.Resignation_details span{background:#cee5ed; font-weight:bold; padding:2px 8px; border-radius:5px;}

@media (max-width:1300px){
.BigTableDiv{width:100%; overflow-x:scroll; margin:0 0 10px; float:left;}
.BigTableDiv .BigTable{width:1200px;}
}


@media (max-width:991px){
.FormSection .col-md-3{margin: 0 0 15px; float: left; width: 50%;}
.ListTable .table{width:1000px;}
/*.ListTable .mCSB_container{overflow:scroll;}*/
.main-header .top-nav>li>a {padding: 8px 10px;}
.SearchPannel .col-md-3{width:100%; float:left; margin:0 0 15px;}
.FormSection .col-md-6{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-3{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-4{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-12{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-lg-12{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-lg-9{margin: 0 0 15px; float: left; width: 100%;}
}

@media (max-width: 768px){
html, body{height:auto;}
.ListTable{width:100%; height:300px; padding:0 0 17px;/* overflow:scroll;*/}
.navbar-custom-menu{background:#eee; display:inline-block; width:100%;}
.pagination{float: left !important;}
.ListTable .table{width:1000px;}
/*.ListTable .mCSB_container{overflow:scroll;}*/
.FormSection{padding:15px 0; margin:0 0 15px; width:100%; float:left; border: 1px solid #ccc;}
.SearchPannel .col-md-3{width:100%; float:left; margin:0 0 15px;}
.FormSection .col-md-6{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-3{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-4{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-md-12{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-lg-12{margin: 0 0 15px; float: left; width: 100%;}
.FormSection .col-lg-9{margin: 0 0 15px; float: left; width: 100%;}
}

@media only screen and (min-width: 280px) and (max-width: 640px){
.fa{padding: 3px 5px; width: 20px; float: right !important; margin: 0;}
}