/* On screens that are 600px or less, set the background color to olive */

@media only screen and (max-width: 768px) {

	/* *, ::after, ::before {
    box-sizing: border-box;
} */
	.footer p {
		font-size: 8px;
	}

	/* End footer */
	p {
		font-size: 12px;
	}

	/* Start Dashboard */
	.ChartPanel {
		width: 90%;
	}

	.DashCounter {
		min-width: 40%;
	}

	/* End of Dashboard */
	.H-title {
		font-size: 13px;
		height: 28px;
		width: 35%;
		line-height: 28px;
	}

	.CountertRow,
	.ChartRow {
		padding: 0;
		width: 98%;
	}

	.Breadcrumb ul {
		float: none;
		width: 100%;
	}

	/* Start Profile Page  */


	.APC-left h2 {
		font-size: 18px;
	}

	.APC-left {
		margin-left: 10px;
	}

	.APC-left p {
		font-size: 12px;
		max-width: 90%;
	}

	.Admin-Profile-Container,
	.Admin-Profile-Container .Row_Cont2 h2,
	.Admin-Profile-Container .Row_Cont3 h2 {
		display: block;
		min-width: fit-content;
		font-size: 15px;
	}

	.Admin-Profile-Container .Row_Cont2 span,
	.Admin-Profile-Container .Row_Cont3 span {
		font-size: 14px;
		width: 65%;
		margin-top: 10px;
		height: fit-content;
	}

	.Admin-Profile-Container .Row_Cont2 span {
		width: 100%;
	}

	.APC-Profile-ImgBox {
		Width: 100px;
		height: 100px;
	}

	.tabs {
		max-width: 98%;
	}

	.tabs span {
		font-size: 14px;
	}

	.tabs p {
		margin: 10px;
	}

	.tabs p input,
	.tabs textarea {
		width: 100%;
	}

	.profilehr {
		margin-top: 20px;
	}

	.per_info h3,
	.Profile-sec h3 {
		font-size: 15px;
		text-align: left;
	}

	.Profile-sec ul li {
		font-size: 14px;
	}

	.Profile-sec ul {
		margin-bottom: 15px;
	}

	/* End Profile Page */

	/* Start Edit Profile  */
	.panel {
		padding: 10px;
	}

	.tabs input,
	.tabs textarea {
		width: 98%;
		font-size: 14px;
	}

	.per_info {
		width: 100%;
	}

	.tabs ul {
		margin: 0;
	}

	/* End Edit Profile */

	/* Start Form section */
	.Row_Cont1,
	.Row_Cont2,
	.Row_Cont3,
	.Row_Cont4,
	.Row_Cont2LS {
		display: block;
		        margin: 0;
        width: 100%;
	}
	.Row_Cont1 span {
    Width: 96%;
}

	.Row_Cont2 span,
	.Row_Cont3 span {
		Width: 97%;
	}

	.Row_Cont2LS span:nth-child(1),
	.Row_Cont2LS span:nth-child(2) {
		Width: 97%;
	}

	.Row_Cont1 table {
		width: 100%;
		margin: 0;
	}

	.Row_Cont1 table input {
		width: 95%;
	}

	.Row_Cont1 table label {
		width: 92%;
	}

	/* End of form section */
	.HBtn-Container {
		width: fit-content;
	}

	.HTitle-Container {
		width: 55%;
	}

	canvas#signature-pad {
		width: 100%;
	}

	.Sign-div input[type="radio"] {
		left: -88px;
	}

	.Sign-div label img {
		height: 50%;
	}

	.Profile-RSec {
		Width: 95%;
	}

	.Comp_Logo {
		Width: 100px;
		height: 100px;
	}

	.Comp_Name {
		Width: 62%;
	}

	/* Login Page */

	.Page-Content-right select,
	.Page-Content-right input,
	.Page-Content-right textarea,
	.Popup-content select,
	.Popup-content input,
	.Popup-content textarea {
		/* width: 100%; */
		/* height: 26px; */
		font-size: 11px;
	}

	.Page-Content-right select,
	.Popup-content select,
	.Row_Cont2 label {
		width: 100%;
	}

	.Row_Cont2 label {
		font-size: 14px;
		font-weight: 400;
	}

	.Page-Content-right select option,
	.Popup-content select option {
		font-size: 11px;
		line-height: 28px;
	}

	.Page-Content-right textarea,
	.Popup-content textarea {
		height: 54px;
		margin: 4px 0 0 0;
		padding: 5px 10px;
	}

	.Page-Content-right-Note,
	.Popup-content {
		width: 90%;
		height: fit-content;
		text-align: center;
		padding: 10px 10px 30px 10px;
		margin: 10px auto 0 auto;
		color: #000;
		border: 1px dashed var(--Menu-Color);
		font-weight: 200;
	}

	.Page-Content-right-Note p {
		font-size: 12px;
	}

	.Page-Content-right-Btn-Container {
		width: 99%;
		height: 10%;
		text-align: center;
		position: absolute;
	}

	.downloadLink a {
		height: 30px;
		line-height: 30px;
		width: fit-content;
		font-size: 8px;
	}

	.Page-Content-left {
		width: 100%;
	}

	.VID {
		display: inline-block;
	}

	.VID span {
		display: block;
		text-align: left;
	}

	.VID span:nth-child(2) {
		text-align: left;
		font-size: 12px;
	}

	.VID label {
		width: 27%;
		font-size: 14px;
		text-align: left;
	}

	.VID input {
		width: 70%;
		text-align: left;
	}

	.Reg-container {
		display: block;
		padding: 0;
		margin: 0;
	}

	.screen__content h2 {
		font-size: 18px;
	}

	.screen,
	.left-text {
		width: fit-content;
		height: fit-content;
		padding: 10px 0;
	}

	.button,
	.subbutton {
		padding: 10px;
	}

	.left-text h2 {
		font-size: 24px;
	}

	/* Start of Login Page */
	.login {
		width: 320px;
		box-shadow: none;
		padding: 0 20px;
	}

	#Otp-Verify {
		width: 100%;
	}

	.Otp-inputs input {
		width: 38px;
		font-size: 20px;
	}

	#mobileNumbersList input {
		height: fit-content;
	}

	#setNumber {
		font-size: 12px;
	}

	/* End of Login Page */
	/* Start Left Menu Section */

	.Menu-Left {
		width: var(--Menu-Width);
		overflow-y: auto;
	}

	.Menu-Left ul li a {
		padding: 8px 8px 8px 8px !important;
	}

	.Menu-Left ul li .fa {
		font-size: 16px;
		width: 32px;
		height: 32px;
		line-height: 30px
	}

	.Menu-Profile {
		margin-top: 60px;

	}

	.Menu-Left {
		position: fixed;
		z-index: 100;
		width: 70%;
		/* calc(100% - 50px); */
		height: 100vh;
		/* float:right; */
		display: none;
		/* position: relative; */
		animation: mymove 0.5s;
		animation-fill-mode: forwards;
		animation-timing-function: ease-out;
	}

	.Menu-Left h2 {
		font-size: 12px;
		width: 88%;
		float: left;
		/* height:32px;  */
		line-height: 28px;
		margin-bottom: 20px;
	}

	.Menu-Left h2 {
		font-size: 14px;
		line-height: 28px;

	}

	/* End Left Menu Section */
	/* Buttons */
	.Master-Btn-Container {
		line-height: 40px;

	}

	.Master-Btn-Container-Right {
		text-align: right;
		margin: 6px 10px 0 0;
		clear: both;
	}

	.Common-Btn,
	.Common-Btn-circle,
	.Common-Btn-Red,
	.Common-Btn-Green,
	.Common-Btn-Orange {
		font-size: 13px;
		font-weight: 400;
		padding: 5px 15px;
	}


	.Common-Btn-circle {
		width: fit-content;
		min-width: 27px;
		height: 27px;
		font-size: 10px;
		padding: 1px 1px;
		margin-bottom: 5px;
	}

	.Browse-btn-grad {
		height: 26px;
		padding: 0 10px;
		line-height: 26px;
		font-size: 12px;
	}

	.Browse-btn-grad:hover {
		font-size: 13px;
	}

	/* End Buttons  */

	.header_logo {
		width: 70px;
		height: 100%;
		float: left;
		margin-left: 0;
	}

	.header_logo img {
		width: auto;
		height: 28px;
	}

	.header_rc {
		width: 86%;
		line-height: var(--header-height);
	}

	.text-title {
		color: var(--primary-color-light);
		background-color: transparent;
		padding: 0 5px;
		font-size: 10px;
		font-weight: 400;
		margin-top: 0px;
	}

	.WlcmText {
		display: none;
	}

	.PromptSuccess,
	.PromptFail {
		width: 70%;
	}

	.right-logo img {
		width: 34px;
		height: 34px;
	}

	.H-title {
		display: none;
	}

	.HideMvers {
		display: none;
	}

	.HideDvers {
		display: block;
	}

	/* End Top Header Section */
	/* Start Dashboard Section */
	.DashCounter {
		float: left;
		width: 40%;
		height: 84px;
		margin: 4px;
	}

	.CountNum ul li:nth-child(odd) {
		font-size: 18px;
	}

	.DashCounter i {
		font-size: 18px;
		width: 2rem;
	}

	.DashCounter,
	.ChartPanel {
		padding: 8px;
		height: fit-content;
	}

	.DashCounter {
		width: fit-content;
		min-width: 42%;
	}

	.ChartRow {
		display: block;
	}

	.ChartPanel {
		width: 92%;
		margin: 4px;
	}

	.panel-heading {
		font-size: 14px;
	}

	.DashCounter h3 {
		font-size: 16px;

	}

	.DashCounter img {
		width: 60%;
	}

	.CountNum ul li:nth-child(even) {
		font-size: 12px;
	}

	.CountBottom ul li {
		font-size: 11px;
	}

	/* End of Dashboard Section */
	.APC-left {
		Width: 100%;
		margin: 0;
		margin-top: 68px;
	}

	.APC-Profile-ImgBox {
		width: 100px;
		height: 100px;
		margin-bottom: 10px;
	}

	.APC-left {
		Width: 100%;
		margin: 0;
		margin-left: 10px;
	}

	/* Start Search section */
	.Search-Filter-Container {
		width: 100%;
		background-color: #f1f2f7;
		height: fit-content;
		margin: 0 0 10px 0;
		display: flex;
		/* border-top: 1px solid var(--primary-color); */
		border-bottom: 1px solid var(--primary-color);
	}

	.Search-FC-Section-left {
		width: 100%;
		line-height: 24px;
		text-align: center;
		color: #00AEEF;
		float: left;
		padding: 8px 0;
	}

	.Search-Filter-Container select,
	.Search-Filter-Container input {
		width: 40%;
		height: 22px;
		font-size: 10px;
		padding: 0 10px;
		background-color: #fff;
		border: 1px solid gray;
		outline: none;
		margin: 0 auto 3px auto;
	}

	.Search-Filter-Container input {
		/* width: 81%; */
		width: 40%;
		max-width: 178px;
	}

	.Search-Filter-Container input[id="date"] {
		width: 28.5%;
		height: 22px;
	}

	.Search-Filter-Container button {
		clear: both;
		width: 24px;
		height: 24px;
		border-radius: 0%;
		font-size: 10px;
	}

	/* End Search Section */
	fieldset {
		width: 50%;
		font-size: 12px;
	}

	details label input,
	fieldset ul li input {
		top: 8px;
		position: relative;
	}

	.Profile-Info p {
		line-height: 28px;
		font-size: 14px;
	}

	.Profile-Info p span {
		width: 100%;
		font-size: 15px;
		font-weight: 500;
	}

	.ci-user-picture {
		max-width: 100px;
	}

	/* Add Emp Section */
	.AEP-TwoSection input,
	.AEP-TwoSection select,
	.AEP-ThreeSection input,
	.AEP-ThreeSection select,
	.AEPT_Four-content-Sec {
		width: 95%;
		float: none;
		height: fit-content;
		font-size: 12px;
		box-sizing: content-box;
	}

	.AEPT_comtent_98 input,
	.AEPT_comtent textarea {
		width: 95%;
	}

	.AEPT_comtent,
	.AEPT_Three-content-Sec {
		width: 100%;
		float: none;
		padding: 0 6px;
		clear: both;
	}

	.AEPT_comtent input,
	.AEPT_comtent select,
	.AEPT_Three-content-Sec input,
	.AEPT_Three-content-Sec select {
		height: 26px;
		margin: 2px;
	}

	.AEP-ThreeSection input,
	.AEP-ThreeSection select {
		margin: 4px;
	}

	.card-body {
		padding: 0;
	}

	.ChartCanvas {
		min-height: 100px;
		min-width: 100px;
	}
	

    .Row_Cont2 span h2 {
        display: inline-block !important;
        width: 120px !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 14px !important;
        font-weight: 500;
        text-align: left !important;
    }


  

}

@media only screen and (max-width: 425px) {

	html,
	body {
		height: fit-content;
	}

	@keyframes mymove {
		from {
			right: -200px;
		}

		to {
			right: 0px;
		}
	}

	:root {
		/* --primary-color-light: #01705f; */
		--header-height: 32px;
		--footer-height: 26px;
		--Menu-Width: fit-content;
		--HTitle-C-width: fit-content;

	}

	.MainBody {
		position: sticky;
		width: 98%;
		height: 100%;
		max-height: fit-content;
		margin-bottom: 0px;
		overflow: hidden;
	}



	/* Start bottom Menu Section */

	.Menu-bottom {
		clear: both;
		position: fixed;
		left: 0;
		bottom: 28px;
		width: 100%;
		height: fit-content;
		background-color: transparent;
		border-bottom: 8px solid var(--primary-color-light);
		/* overflow-y: auto; */
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.Menu-bottom ul li {
		display: inline-block;
		text-align: left;
		list-style-type: none;
		margin-bottom: -12px;
	}

	.Menu-bottom ul li small {
		display: none;
	}

	.Menu-bottom ul li a {
		padding: 1px !important;
	}

	.Menu-bottom ul li .fa {
		font-size: 14px;
		width: 32px;
		height: 32px;
		line-height: 32px;
		background-color: var(--primary-color-light);
		color: #fff;
	}

	.Menu-bottom {
		margin-top: 1px;
	}

	/* End bottom Menu Section */


	.Page-Content {
		margin: 0 0 var(--footer-height) 0;
		overflow: inherit;
	}

	.Page-Content-right {
		position: absolute;
		top: 10;
		z-index: 100;
		width: 100%;
		height: 100vh;
		display: none;
		animation: mymove 0.5s;
		animation-fill-mode: forwards;
		animation-timing-function: ease-out;
	}

	.Page-Content-right h2 {
		font-size: 12px;
		width: 88%;
		float: left;
		line-height: 28px;
		margin-bottom: 20px;
	}

	.Popup-content h2 {
		font-size: 14px;
		line-height: 28px;
	}

	.Page-Content-right select,
	.Page-Content-right input,
	.Page-Content-right textarea,
	.Popup-content select,
	.Popup-content input,
	.Popup-content textarea {
		/* height: 26px; */
		font-size: 12px;
	}

	.Page-Content-right select,
	.Popup-content select {
		width: 99%;
	}

	.Page-Content-right select option,
	.Popup-content select option {
		font-size: 11px;
		line-height: 28px;

	}

	.Page-Content-right textarea,
	.Popup-content textarea {
		height: 54px;
		margin: 4px 0 0 0;
		padding: 5px 10px;
	}

	.Page-Content-right-Note,
	.Popup-content {
		width: 70%;
		height: fit-content;
		text-align: center;
		padding: 10px;
		margin: 10px auto 0 auto;
		color: #fff;
		border: 1px dashed var(--Menu-Color);
		font-weight: 200;
	}

	.Page-Content-right-Note p {
		font-size: 12px;
	}

	.Page-Content-right-Btn-Container {
		width: 99%;
		height: 10%;
		/* margin-top:50%; */
		text-align: center;
		position: absolute;
	}



	/* Start Heading Button Section */
	.Heading-Btn-Container {
		width: 100%;
		height: fit-content;
		padding-bottom: 5px;
	}

	.HTitle-Container {
		display: none;
	}

	.HBtn-Container input {
		font-size: 14px;
		height: 26px;
	}

	.HTitle-Container h2 {
		font-size: 12px;
		text-align: left;
		padding: 0 4px;
		float: left;
	}

	.HBtn-Container {
		/* width: 20%; */
		width: 100%;
		min-width: fit-content;
		display: block;
		float: right;
		text-align: right;
		padding: 1px 5px 0 0;
		line-height: 30px;
		/* background-color:#718679; */
	}



	/* Start Table Section */
	.Lead-table table {
		margin: 10px 0;
	}

	.Lead-table table thead th {
		padding: 2px 6px;
		font-size: 11px;
		width: fit-content;
		font-weight: 400;
		line-height: 20px;
		background-color: var(--primary-color);
	}

	.Lead-table table td:first-child {
		text-align: center;
		width: 30px;
	}

	.Lead-table table td p {
		text-align: justify;
		padding-left: 5px;
		font-size: 10px;
	}

	.Lead-table table th,
	.Lead-table table td {
		padding: 0 3px;
		max-width: 700px;
		overflow: auto;
		font-size: 12px;
		line-height: 20px;
	}

	.Lead-table table td a {
		text-align: justify;
		font-size: 8px;
	}

	/* End Table Section */

	/* Start Note Section */
	.NoteSection {
		display: none;
	}

	/* END Note Section */
	/* Start footer */
	.footer p {
		font-size: 8px;
		padding-right: 20px;
	}

	/* start Pagination */

	nav[role="navigation"] {
		text-align: center;
	}

	.cd-pagination {
		width: 100%;
		max-width: 768px;
		margin: 0 auto;
		text-align: center;
	}

	.cd-pagination li {
		display: inline-block;
		margin: 0.05em;
	}

	.cd-pagination a {
		color: black;
		background-color: #8cc751;
		padding: 3px 8px;
		text-decoration: none;
		transition: background-color .3s;
		border: 1px solid #ddd;
		font-size: 10px;
	}

	.currentCount {
		padding: 3px 8px;
		font-size: 10px;
	}

	/* End Pagination */

	/* End footer */

	.Popup-content {
		width: 90%;
		padding: 10px;
		margin-top: 100px;
		color: #000;
	}

	.Popup-close-btn {
		float: right;
		background-color: black;
		color: white;
		width: 28px;
		height: 28px;
		font-size: 18px;
		line-height: 28px;
		top: -18px;
		left: 18px;
	}

	/* Added by PD */

	.eq-Sec2 {
		display: inline;
	}

	.eq_Marks,
	.eq_DL,
	.eq_Ans {
		width: 90%;
		height: 12px;
		line-height: 10px;
		/* display: inline-flex; */
		margin: 3px;
		font-size: 12px;
	}

	.eq_Marks span {
		text-align: left;
		font-size: 14px;
	}



	h2 {
		font-size: 16px;
	}

	.Page-Container ol li {
		font-size: 13px;
	}

	.TC {
		text-align: center;
		font-size: 16px;
	}

	.Page-Container {
		width: 82%;
		padding: 10px 30px 50px 30px;
		margin: 10px auto 40px auto;
	}

	.Summ-Counter ul {
		min-width: 72%;
		margin: 5px;
	}

	.conf-box p {
		margin: 14px 0;
	}

	.HideDMView {
		display: none;
	}

	.Breadcrumb li a,
	.Breadcrumb li {
		font-size: 12px;
	}

	#eye_icon {
		top: 134px;
	}

	.header {
		z-index: 1;
		padding: 0;
	}

	.Proj-Counter ul {
		min-width: 80%;
		margin: 5px;
	}

	.Profile-sec {
		width: 100%;
		display: block;
	}

	.Profile-left-sec,
	.Profile-right-sec {
		width: 90%;
	}




	/* start Team Profile page */
	.card-body {
		display: block;
	}

	.Comp_Name h3 {
		font-size: 15px;
		font-weight: 500;
	}

	.Comp_Name {
		Width: 95%;
	}

	.Profile-Info {
		Width: 100%;
	}

	.Profile-RSec {
		Width: 98%;
		padding: 0;
		margin: 0 auto;
	}

	.Comp_Logo {
		right: 15px;
		background: #fff;
		width: 100px;
		height: 100px;
	}

	/* End of team profile page */

	/* Mobile Resposive Table */
	.Row_Cont2 table {
		width: 100%;
		margin-bottom: 0;
		background-color: transparent;
	}

	.Row_Cont2 table thead,
	.Row_Cont2 table tfoot {
		display: none;
	}

	.Row_Cont2 table tbody {
		display: block;
	}

	.Row_Cont2 table tbody tr {
		display: block;
		/* border: 1px solid #000; */
		border-radius: 2px;
		margin-bottom: 10px;
	}

	.Row_Cont2 table tbody tr td {
		background-color: #fff;
		display: block;
		vertical-align: middle;
		text-align: right;
		min-width: 100%;
		padding: 4px;
	}

	.Row_Cont2 table tbody td[data-title]:before {
		content: attr(data-title);
		float: left;
		font-size: inherit;
		font-weight: 400;
		color: #000;
		font-size: 12px;
	}

	.Row_Cont2 input,
	.Row_Cont2LS input {
		width: 94%;
		font-size: 12px;
		height: 30px;
		box-sizing: content-box;
	}

	.remove-btn {
		width: 30%;
	}

	.Row_Browse_Btn {
		width: 100%;
	}

	/* End of mobile resposive table */

	/* Start Generate Document  */
	.San-Form-logo img {
		height: 40px;
	}

	.San-Form-Title h3 {
		font-size: 12px;
		margin-top: 0;
	}

	.form {
		padding: 0;
		width: 98%;
	}

	.San-Form p {
		margin: 0;
	}

	.San-Form span {
		font-size: 10px;
	}

	.Step-Textarea {
		width: 99%;
	}

	.SW50 img {
		width: 25%;
	}

	.San-Form td[class="SW50"] {
		height: 65px;
	}

	.signsec {
		display: block;
	}

	.signsec h4 {
		font-size: 14px;
	}

	.tabs table tr td {
		font-size: 12px;
	}

	.Row_Cont1 label {
		font-weight: 400;
		font-size: 14px;
	}

	.modal-dialog {
		top: 40px;
	}

	/* End of Generate document */



	.pd {
		padding: 2px;
	}

	/* Attendance */
	.AttendanceModule {
		height: 800px;
	}

	.col-sm-2 {
		width: 54%;
	}

	.CheckIn img {
		width: 25%;
		float: right;
	}

	.year,
	.Month {
		font-size: 12px;
	}

	.Month select {

		font-size: 10px;
	}

	.AttendanceDaysCounter p {
		font-size: 10px;
		display: none;
	}

	.AttendanceDaysCounter h6 {
		font-size: 10px;
		width: 100%;
	}

	.AttendanceDaysCounter {
		border: none;
	}

	.AttendanceDaysCounterMView {
		width: 28%;
	}

	.calendar .day {
		border-right: 0;
		padding: 2px 7px;
		font-size: 12px;
	}

	.calendar .day:last-child {
		border: 1px solid #ddd;
	}

	.calendar .day-name {
		font-size: 14px;
	}

	.LeaveTypeMView {
		width: 20%;
	}

	.Present p,
	.Vocation p,
	.Personal p,
	.Sick p {
		display: none;

	}

	.Present h5,
	.Vocation h5,
	.Personal h5,
	.Sick h5 {
		width: 70%;
		font-size: 10px;
	}

	.Time-abbr p {
		width: 100%;
	}

	/* End Attendance */

	.San-Form-logo img,
	.midlogo img {
		height: 38px;
	}

}

@media (max-width:991px) {

	.RegisterPage form,
	.LoginPage form {
		padding: 40px;
	}
}


@media only screen and (min-width: 768px) {
	.cd-pagination li {
		display: inline-block;
	}


}

@media only screen and (min-width: 1170px) {
	.cd-pagination {
		margin: 0 auto;
	}
}

@media only screen and (min-width: 768px) {
	.H-title {
		display: block;
	}
}

@media (min-width: 768px) {
	.DashCounter {
		width: 42%;
	}
}

@media (min-width: 1200px) {
	.DashCounter {
		width: 20%;
	}

	.card-body {
		width: 98%;
	}
}

@media print {
	@page {
		size: A4 portrait;
		margin: 1cm;
	}

	.Common-Btn {
		display: none;
	}
}