/************************************************************************************
smaller than 1280 / 1920
*************************************************************************************/
@media screen and (max-width: 1920px) {

	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#LeaveRequest1 {
		width: 20%;
	}

	#LeaveRequest2 {
		width: 20%;
	}

	#LeaveRequest3 {
		width: 10%;
	}

	#LeaveRequest4 {
		width: 50%;
        padding-bottom:5px;
	}

    #divMain {
        float:left;
        padding:0px;
    }

    /*#HomePage1 {
        width: auto;
		float: left;
        margin: 0px;
        padding: 0px 5px 0px 0px;
    }*/

    #HomePage2 {
        width: 100%;
		float: none;
        margin: 0px;
        padding: 0px;
    }

    /*#HomePage3 {
        width: auto;
		float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
    }

    #HomePage4 {
        width: 32%;
		float: left;
        margin: 0px;
        padding: 0px 2px 0px 0px;
    }*/

    #HomePage3 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px;
    }

    #HomePage4 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px;
    }

    #HomePage5 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px;
    }

	#TSClockHistoryDate1 {
		width: 13%;
        padding-bottom: 5px;
	}

	#TSClockHistoryDate2 {
		width: 13%;
        padding-bottom: 5px;
	}

	#TSClockHistoryButton1 {
		width: 10%;
        padding-right:5px;
        padding-bottom:0px;
	}

	#TSClockHistoryButton2 {
		width: 10%;
        padding-bottom:0px;
	}

	#TSEntryByRow1 {
		width: 30vw;
    	margin-top:35px;
	    margin-right:10px;
        margin-left:0px;
	}

	#TSEntryByRow2 {
		width: 30vw;
    	margin-top:35px;
	    margin-right:10px;
	}

	#TSEntryByRow3 {
		width: 30vw;
    	margin-top:35px;
	    margin-right:10px;
	}

	#TSEntryByRow4 {
		width: 100%;
        margin-top:0px;
        margin-bottom:0px;
        float: left;
    	position:absolute;
	}


    
    #EmpPayStubGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

    #TSInOutBoardGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

	#TSManualPunch1 {
		width: 20%;
	    float: left;
	    margin: 0px 0px 0px;
	}

	#TSManualPunch2 {
		width: 20%;
	    float: left;
	    margin: 0px 0px 0px;
	}

	#TSManualPunch3 {
		width: 20%;
	    float: left;
	    margin: 0px 0px 0px;
	}

	#TSManualPunch4 {
		width: 30%;
	    float: left;
	    margin: 0px 0px 0px;
	}

    #LightMasterHeading1 {
        width:34%;
    }

    #LightMasterHeading2 {
        width:5%;
    }

	#ApproveLeaveScheduler1 {
		width: 15%;
	}

	#ApproveLeaveScheduler2 {
		width: 10%;
	}

	#ApproveLeaveScheduler3 {
		width: 10%;
	}

	#ApproveLeaveScheduler4 {
		width: 10%;
	}

	#PTS1 {
		width: 20%;
	}

	/*#PTS2 {
		width: 20%;
	}*/

	#PTS3 {
		width: 20%;
	}


    #POReportsName {
	    width: 20vw;
        margin:0px;
        padding:0px;
    }

    #POReportsLayout {
	    width: 15vw;
        margin:0px;
        padding:0px;
    }

    #POReportsDateFilter {
	    width: 40vw;
        margin:0px;
        padding:0px;
    }

    #POReportsCustomizationButton {
        width: 18vw;
        margin: 0px;
        padding: 0px;
    }


    #POReportsDateFilterFromDate {
	    width: 24%;
        margin-right:0px;
        padding-right:3px;
    }

    #POReportsDateFilterToDate {
	    width: 24%;
        margin-right:0px;
        padding-right:3px;
    }

    #POReportsDateFilterButtonsFind {
	    width: 16%;
        margin-right:12px;
        padding-right:5px;
    }

    #POReportsDateFilterButtonsPrint {
	    width: 16%;
        margin-right:0px;
        padding-right:0px;
    }

    #POReportsDateFilterButtonsPrintOption {
	    width: 16%;
        margin-right:0px;
        padding-right:0px;
    }

    #TSHReportsName {
	    width: 20vw;
        margin:0px;
        padding:0px;
    }

    #TSHReportsLayout {
	    width: 15vw;
        margin:0px;
        padding:0px;
    }

    #TSHReportsDateFilter {
	    width: 33vw;
        margin:0px;
        padding:0px;
    }

    #TSHReportsCustomizationButton {
        width: 18vw;
        margin: 0px;
        padding: 0px;
    }

    #TSHReportsDateFilterFromDate {
	    width: 28%;
        margin-right:0px;
        padding-right:3px;
    }

    #TSHReportsDateFilterToDate {
	    width: 28%;
        margin-right:0px;
        padding-right:3px;
    }

    #TSHReportsDateFilterButtonsFind {
	    width: 18%;
        margin-right:12px;
        padding-right:5px;
    }

    #TSHReportsDateFilterButtonsPrint {
	    width: 18%;
        margin-right:0px;
        padding-right:0px;
    }

    #BudgetQueryDateFilter {
	    width: 100%;
        margin:0px;
    }

    #POReceivingDocumentInformation {
        width:35%;
	    float: left;
    }

    #POReceivingComments {
        width:20%;
        float: left;
    }

    #POReceivingVendorInfo {
	    width: 20%;
	    float: left;
    }

    #POReceivingBillingInfo {
	    width: 20%;
	    float: left;
    }


	#POEntryDocumentInfo {
		width: 68%;
        /*padding-bottom:5px;*/
	}

	#POEntryDocNo {
		width: 25%;
	}

	#POEntryWorkflowBillToShipTo {
		width: 20%;
	}

	#POEntryVendorInfo {
		width: 29%;
	}

	#POEntryReason {
		width: 20%;
        padding:0px;
        margin:0px;
	}

	#POEntryUDF {
		width: 25%;
        /*padding-bottom:5px;*/
	}

	#EmployeeInfo {
		width: 100%;
	}

	#EmployeeName {
		width: 25%;
	}

	#EmployeeAddress {
		width: 30%;
	}

	#EmployeeOtherDetails {
		width: 25%;
	}


    #EmployeeDemographicInfo {
        width:17%;
    }

    #EmployeeDemographicInfo1 {
        width:40%;
    }

    #EmployeeDemographicInfo2 {
        width:40%;
    }

    #EmployeeImportantDates {
        width:17%;
    }

    #EmployeeImportantDates1 {
        width:40%;
    }

    #EmployeeImportantDates2 {
        width:40%;
    }

    #EmployeeEmergencyContact {
        width:34%;
    }

    #EmployeeEmergencyContact1 {
        width:40%;
    }

    #EmployeeEmergencyContact2 {
        width:40%;
    }

    #EmployeeDriverLicense {
        width:32%;
    }

    #EmployeeDriverLicense1 {
        width:40%;
    }

    #EmployeeDriverLicense2 {
        width:40%;
    }

    #EmployeePayrollInfo {
        width:100%;
    }

    #EmployeePayrollInfo1 {
        width:30%;
    }

    #EmployeePayrollInfo2 {
        width:30%;
    }

    #EmployeePayrollInfo3 {
        width:30%;
    }
}

/************************************************************************************
smaller than 1440
*************************************************************************************/
@media screen and (max-width: 1440px) {

	#POEntryDocumentInfo {
		width: 73%;
        /*padding-bottom:5px;*/
	}

	#POEntryDocNo {
		width: 20%;
	}

	#POEntryWorkflowBillToShipTo {
		width: 18%;
	}

	#POEntryVendorInfo {
		width: 31%;
	}

	#POEntryReason {
		width: 20%;
        padding:0px;
        margin:0px;
	}

	#POEntryUDF {
		width: 6%;
        /*padding-bottom:5px;*/
	}

    #TSHReportsDateFilter {
	    width: 45vw;
    }

    #POReportsDateFilter {
	    width: 45vw;
    }

	
}

/************************************************************************************
smaller than 1280
*************************************************************************************/
@media screen and (max-width: 1280px) {

    #TSEntryByRow1 {
        width: 30vw;
        margin-top: 60px;
        margin-right: 10px;
        margin-left: 0px;
    }

    #TSEntryByRow2 {
        width: 30vw;
        margin-top: 60px;
        margin-right: 10px;
    }

    #TSEntryByRow3 {
        width: 30vw;
        margin-top: 60px;
        margin-right: 10px;
    }

    #TSEntryByRow4 {
        width: 100%;
        float: left;
        position: absolute;
    }

    #LightMasterHeading1 {
        width: 34%;
    }

    #LightMasterHeading2 {
        width: 5%;
    }

    #ApproveLeaveScheduler1 {
        width: 20%;
    }

    #ApproveLeaveScheduler2 {
        width: 13%;
    }

    #ApproveLeaveScheduler3 {
        width: 13%;
    }

    #ApproveLeaveScheduler4 {
        width: 13%;
    }

    #POReportsName {
        width: 25vw;
        margin: 0px;
    }

    #POReportsLayout {
        width: 20vw;
        margin: 0px;
    }

    #POReportsDateFilter {
        width: 50vw;
        margin: 0px;
    }

    #POReportsCustomizationButton {
        width: 45vw;
        margin:0px;
    }

    #TSHReportsName {
        width: 25vw;
        margin: 0px;
    }

    #TSHReportsLayout {
	    width: 20vw;
        margin:0px;
    }

    #TSHReportsDateFilter {
	    width: 50vw;
        margin:0px;
    }

    #TSHReportsCustomizationButton {
        width: 45vw;
        margin: 0px;
    }

    #BudgetQueryDateFilter {
	    width: 100%;
        margin:0px;
    }

    #POReceivingDocumentInformation {
        width:35%;
	    float: left;
    	margin: 5% 0% 0% 0%;
    }

    #POReceivingComments {
        width:22%;
        float: left;
    	margin: 5% 0% 0% 0%;
        padding-right:20px;
    }

    #POReceivingVendorInfo {
	    width: 17%;
	    float: left;
    	margin: 5% 0% 0% 0%;
        padding-left:10px;
    }

    #POReceivingBillingInfo {
	    width: 18%;
	    float: left;
    	margin: 5% 0% 0% 0%;
        padding-left:10px;
    }

	#POEntryDocumentInfo {
		width: 100%;
        /*padding-bottom:5px;*/
	}

	#POEntryDocNo {
		width: 25%;
	}

	#POEntryWorkflowBillToShipTo {
		width: 18%;
	}

	#POEntryVendorInfo {
		width: 29%;
	}

	#POEntryReason {
		width: 10%;
        padding:0px;
        margin:0px;
	}

	#POEntryUDF {
		width: 100%;
        /*padding-bottom:5px;*/
	}

    #EmployeeDemographicInfo {
        width:19%;
    }

    #EmployeeDemographicInfo1 {
        width:41%;
    }

    #EmployeeDemographicInfo2 {
        width:41%;
    }

    #EmployeeImportantDates {
        width:19%;
    }

    #EmployeeImportantDates1 {
        width:41%;
    }

    #EmployeeImportantDates2 {
        width:41%;
    }

    #EmployeeEmergencyContact {
        width:32%;
    }

    #EmployeeEmergencyContact1 {
        width:39%;
    }

    #EmployeeEmergencyContact2 {
        width:39%;
    }

    #EmployeeDriverLicense {
        width:30%;
    }

    #EmployeeDriverLicense1 {
        width:39%;
    }

    #EmployeeDriverLicense2 {
        width:39%;
    }

}

/************************************************************************************
smaller than 980
*************************************************************************************/

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

	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#LeaveRequest1 {
		width: 30vw;
	}

	#LeaveRequest2 {
		width: 30vw;
	}

	#LeaveRequest3 {
		width: 30vw;
	}

	#LeaveRequest4 {
		width: 80%;
        padding-bottom:5px;
	}

    #LeaveRequestchkFMLA {
        margin-top:9%;
        margin-left:0px;
    }

    #LeaveRequestchkUseShiftHrs {
        float:left;
        margin-right:0%;
        margin-top:9%;
    }

	#TimeClock {
		width: 95%;
	}

	#TimeClockEmail {
		width: 95%;
	}

	#Login {
		width: 95%;
	}

	#LoginEmail {
		width: 95%;
	}

    #ChangePassword {
		width: 95%;
    }

    #divMainTimeClock {
	    width: 70%;
        height:100%;
        position:relative;
        float:none;
        top:80px;
    }

    #divMainLogin {
	    width: 50%;
        height:30%;
    }

    #divMain {
        float:left;
        padding:0px;
    }

    /*#HomePage1 {
        width: auto;
		float: left;
        margin: 0px;
        padding: 0px 3px 0px 0px;
    }*/

    #HomePage2 {
        width: 100%;
		float: none;
        margin: 0px;
        padding: 0px;
    }

    /*#HomePage3 {
        width: auto;
		float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
    }

    #HomePage4 {
        width: 32%;
		float: left;
        margin: 0px;
        padding: 0px 2px 0px 0px;
    }*/

    #HomePage3 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
    }

    #HomePage4 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px 0px 0px 0px;
    }

    #HomePage5 {
        width: 33%;
		float: left;
        margin: 0px;
        padding: 0px;
    }

	#TSClockHistoryDate1 {
		width: 17%;
        padding-bottom: 5px;
	}

	#TSClockHistoryDate2 {
		width: 17%;
        padding-bottom: 5px;
	}

	#TSClockHistoryButton1 {
		width: 10%;
        padding-right:25px;
        padding-bottom:0px;
	}

	#TSClockHistoryButton2 {
		width: 10%;
        padding-bottom:0px;
	}


	#TSEntryByRow1 {
		width: 24vw;
    	margin-top:60px;
	    margin-right:5px;
        margin-left:0px;
	}

	#TSEntryByRow2 {
		width: 24vw;
    	margin-top:60px;
	    margin-right:5px;
	}

	#TSEntryByRow3 {
		width: 39vw;
    	margin-top:60px;
	    margin-right:0px;
	}

	#TSEntryByRow4 {
		width: 100%;
        float: left;
    	position:absolute;
	}

    #EmpPayStubGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

    #EmpPayStubDivGvwPayStub {
        float:left; 
        margin-bottom:2px;
        width:100%;
    }

    #EmpPayStubDivGvwLeaveInformation {
        float:none; 
        padding-left:0px;
        padding-top:0px; 
        margin-right:0%; 
        margin-top:2px;
        width:100%;
    }

	#TSManualPunch1 {
		width: 30%;
	}

	#TSManualPunch2 {
		width: 30%;
	}

	#TSManualPunch3 {
		width: 30%;
	}

	#TSManualPunch4 {
		width: 90%;
        padding-bottom:5px;
	}

    #LightMasterHeading1 {
        width:100%;
    }

    #LightMasterHeading2 {
        width:5%;
    }

	#ApproveLeaveScheduler1 {
		width: 30%;
	}

	#ApproveLeaveScheduler2 {
		width: 20%;
	}

	#ApproveLeaveScheduler3 {
		width: 20%;
	}

	#ApproveLeaveScheduler4 {
		width: 20%;
	}

	#PTS1 {
		width: 30%;
	}

	/*#PTS2 {
		width: 30%;
	}*/

	#PTS3 {
		width: 30%;
	}

    #AuditTrailComments {
        width: 47%;
    }

    #POReceivingDocumentInformation {
        width:60%;
	    float: left;
    	margin: 8% 0% 0% 0%;
        padding: 0px 0px 0px 5px;
    }

    #POReceivingComments {
        width:30%;
        height:180px;
        float: left;
    	margin: 8% 0% 0% 0%;
        padding: 0px 0px 0px 5px;
    }

    #POReceivingVendorInfo {
	    width: 60%;
	    float: left;
    	margin: 1% 0% 0% 0%;
        padding:0px 0px 0px 5px;
        padding-bottom:10px;
    }

    #POReceivingBillingInfo {
	    width: 33%;
	    float: left;
    	margin: 1% 0% 0% 0%;
        padding:0px 0px 0px 5px;
        padding-bottom:10px;
    }

	#TimeClockEntries1 {
		width: 34vw;
	}

	#TimeClockEntries2 {
		width: 27vw;
	}

	#TimeClockEntries3 {
		width: 34vw;
	}

	#POEntryDocNo {
		width: 50vw;
	}

    #POEntryDocNoDescription {
        width:107%;
        float:left;
    }

    #POEntryDocumentInfo {
        width:95vw;
    }

	#POEntryWorkflowBillToShipTo {
		width: 38vw;
	}

	#POEntryVendorInfo {
		width: 50vw;
	}

	#POEntryReason {
		width: 38vw;
        margin-left:5px;
	}

    #POEntryUDF {
		width: 95vw;
        /*padding-bottom:5px;*/
	}


    #POReportsName {
	    width: 40vw;
        margin:0px;
    }

    #POReportsLayout {
	    width: 40vw;
        margin:0px;
    }

    #POReportsDateFilter {
	    width: 80vw;
        margin:0px;
        display:block;
    }

    #POReportsCustomizationButton {
        width: 80vw;
        margin: 0px;
    }

    #TSHReportsName {
	    width: 40vw;
        margin:0px;
    }

    #TSHReportsLayout {
	    width: 40vw;
        margin:0px;
    }

    #TSHReportsDateFilter {
	    width: 80vw;
        margin:0px;
        display:block;
    }

    #TSHReportsCustomizationButton {
        width: 80vw;
        margin: 0px;
    }

    #EmployeeInfo {
        width:95vw;
    }

	#EmployeeName {
		width: 20vw;
	}

	#EmployeeAddress {
		width: 35vw;
	}

	#EmployeeOtherDetails {
		width: 20vw;
	}


    #EmployeeDemographicInfo {
        width:50%;
    }

    #EmployeeDemographicInfo1 {
        width:41%;
    }

    #EmployeeDemographicInfo2 {
        width:41%;
    }

    #EmployeeImportantDates {
        width:50%;
    }

    #EmployeeImportantDates1 {
        width:41%;
    }

    #EmployeeImportantDates2 {
        width:41%;
    }

    #EmployeeEmergencyContact {
        width:50%;
    }

    #EmployeeEmergencyContact1 {
        width:39%;
    }

    #EmployeeEmergencyContact2 {
        width:39%;
    }

    #EmployeeDriverLicense {
        width:50%;
    }

    #EmployeeDriverLicense1 {
        width:39%;
    }

    #EmployeeDriverLicense2 {
        width:39%;
    }

}

/************************************************************************************
smaller than 650
*************************************************************************************/
@media screen and (max-width: 650px) {

	#content {
		width: auto;
		float: none;
		margin: 20px 0;
	}

	#LeaveRequest1 {
		width: 45vw;
        margin-bottom:0px;
	}

	#LeaveRequest2 {
		width: 45vw;
        margin-bottom:0px;
	}

	#LeaveRequest3 {
		width: 100%;
        margin-top:0px;
        margin-left:0px;
	}

	#LeaveRequest4 {
		width: 80%;
        padding-bottom:5px;
	}

    #LeaveRequestchkFMLA {
        margin-top:0px;
        margin-left:0px;
    }

    #LeaveRequestchkUseShiftHrs {
        margin-top:0px;
        margin-bottom:0px;
        margin-left:0px;
    }

	#TimeClock {
		width: 95%;
	}

	#TimeClockEmail {
		width: 95%;
	}

	#Login {
		width: 95%;
	}

	#LoginEmail {
		width: 95%;
	}

    #ChangePassword {
		width: 95%;
    }

    #divMainTimeClock {
	    width: 90%;
        height:100%;
        position:relative;
        float:none;
        top:80px;
    }

    #divMainLogin {
	    width: 50%;
        height:30%;
    }

    #divMain {
        float:left;
        padding:0px;
    }

    /*#HomePage1 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px 0px 2px 0px;
    }*/

    #HomePage2 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px;
    }

    #HomePage3 {
        width:100%;
		float:none;
        margin: 0px;
        padding: 0px 0px 4px 0px;
    }

    #HomePage4 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px 0px 4px 0px;
    }

    #HomePage5 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px;
    }


    
	#TSEntryByRow1 {
		width: 45vw;
        margin-top:60px;
        margin-right:10px;
        margin-left:0px;
	}

	#TSEntryByRow2 {
		width: 45vw;
        margin-top:60px;
        margin-right:0px;
        margin-left:0px;
	}

	#TSEntryByRow3 {
		width: 90vw;
        float: left;
        margin-right: 1000px;
        margin-top:0px;
        margin-left:0px;
	}

	#TSEntryByRow4 {
		width: 100%;
        float: left;
        position:absolute;
	}

    #EmpPayStubGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

    #EmpPayStubDivGvwPayStub {
        float:left; 
        margin-bottom:2px;
        width:100%;
    }

    #EmpPayStubDivGvwLeaveInformation {
        float:none; 
        padding-left:0px;
        padding-top:0px; 
        margin-right:0%; 
        margin-top:2px;
        width:100%;
    }

    #LightMasterHeading1 {
        width:100%;
    }

    #LightMasterHeading2 {
        width:5%;
    }

	#PTS1 {
		width: 45vw;
        margin-bottom:3px;
	}

	/*#PTS2 {
		width: 50%;
        margin-bottom:10px;
	}*/

	#PTS3 {
		width: 45vw;
        margin-top:0px;
        margin-bottom:3px;
	}

    #POPunchOutRadioButtonList {
	    margin: 20px 0px 0px;
    }

    #AuditTrailComments {
        width: 100%;
    }

    #AttachmentUpload {
	    width: 60%;
    }

    #AttachmentButtons {
        width:75%;
    }



    /*#POReportsName {
	    width: 100vmin;
        min-width:270px;
	    float: left;
        padding:0px;
        margin:0px;
    }

    #POReportsLayout {
	    width: 100vmin;
        min-width:270px;
        padding:0px;
        margin:0px;
    }

    #POReportsDateFilter {
	    width: 100vmin;
        min-width:540px;
        display:block;
    }*/

    /*#POReportsDateFilterFromDate {
        width:31%;
    }

    #POReportsDateFilterToDate {
        width:31%;
    }

    #POReportsDateFilterButtons {
        width:45%;
    }

    #POReportsDateFilterButtonsFind {
        width:95px;
    }

    #POReportsDateFilterButtonsPrint {
        width:95px;
    }*/


    #BudgetQueryDateFilterFromDate {
        width:50%;
        padding-bottom:0px; 
    }

    #BudgetQueryDateFilterToDate {
        width:50%;
        padding-bottom:0px; 
    }

    #BudgetQueryDateFilterWorkflow {
        width:100%;
        float:right;
        padding-bottom:6px; 
    }

    #POReceivingDocumentInformation {
        width:100%;
	    float: left;
    	margin: 10.5% 0% 0% 0%;
        padding: 0px 0px 0px 5px;
    }

    #POReceivingComments {
        width:100%;
        float: left;
    	margin: 1% 0% 0% 0%;
        padding: 0px 0px 0px 5px;
    }

    #POReceivingVendorInfo {
	    width: 100%;
	    float: left;
    	margin: 1% 0% 0% 0%;
        padding:0px 0px 0px 5px;
    }

    #POReceivingBillingInfo {
	    width: 100%;
	    float: left;
    	margin: 1% 0% 0% 0%;
        padding:0px 0px 0px 5px;
        padding-bottom:10px;
    }

	#POEntryDocNo {
		width: 90vw;
	}

    #POEntryDocNoDescription {
        width:104%;
        float:left;
    }

	#POEntryWorkflowBillToShipTo {
		width: 90vw;
	}

	#POEntryVendorInfo {
		width: 90vw;
        float:left;
        padding-top:0px;
        padding-left: 0px;
        margin-left:0px;
	}

	#POEntryReason {
		width: 90vw;
        margin-left:0px;
	}


	#EmployeeInfo {
		width: 100vw;
	}

	#EmployeeName {
		width: 45vw;
	}

	#EmployeeAddress {
		width: 45vw;
	}

	#EmployeeOtherDetails {
		width: 45vw;
	}

}


/************************************************************************************
smaller than 560
*************************************************************************************/
@media screen and (max-width: 480px) {

	/*html {
		-webkit-text-size-adjust: none;
	}

	#main-nav a {
		font-size: 90%;
		padding: 10px 8px;
	}*/

	#content {
		width: auto;
		float: none;
		margin: 20px 0;
	}

	#LeaveRequest1 {
		width: 100vw;
        margin-right:45%;
        margin-bottom:0px;
	}

	#LeaveRequest2 {
		width: 100vw;
        margin-right:45%;
        margin-bottom:0px;
	}

	#LeaveRequest3 {
		width: 100vw;
        margin-right:45%;
        margin-top:0px;
        margin-left:0px;
	}

	#LeaveRequest4 {
		width: 100vw;
        padding-bottom:5px;
        float:left;
        margin-top:0px;
        margin-left:0px;
        margin-right:100%;
	}

    #LeaveRequestchkFMLA {
        margin-top:0px;
        margin-left:0px;
    }

    #LeaveRequestchkUseShiftHrs {
        margin-top:0px;
        margin-bottom:0px;
        margin-left:0px;
    }

	#TimeClock {
		width: 95%;
	}

	#TimeClockEmail {
		width: 95%;
	}

	#Login {
		width: 95%;
	}

	#LoginEmail {
		width: 95%;
	}

    #ChangePassword {
		width: 95%;
    }

    #divMainTimeClock {
	    width: 100%;
        height:100%;
        position:relative;
        float:none;
    }

    #divMainLogin {
	    width: 100%;
        height:100%;
        position:relative;
        float:left;
    }

    /* vh : viewport height. This changes is for ClockIn/Out And Login Page. if included below code, then leaveRequest page button get disturbed. */
    /*.RoundPanel {
        height:72vh; 
        min-height:90%;
    }*/

    #divMain {
        width:100%;
        height:90%;
        position:relative;
        float:none;
    }

    /*#HomePage1 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px 0px 2px 0px;
    }*/

    #HomePage2 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px 0px 0px 0px;
    }

    #HomePage3 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px 0px 4px 0px;
    }

    #HomePage4 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px 0px 4px 0px;
    }

    #HomePage5 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px;
    }

    /*#TSDocumentListButton {
        width:70vw;
	    float: right;
	    margin: 0px 0px 0px;
    }*/

	#TSClockHistoryDate1 {
		width: 90vw;
        margin-right:45%;
        margin-bottom:0px;
        padding-bottom: 5px;
	}

	#TSClockHistoryDate2 {
		width: 90vw;
        margin-right:45%;
        margin-bottom:0px;
        padding-bottom: 5px;
	}

	#TSClockHistoryButton1 {
        float:left;
		width: 25vw;
        margin-right:15%;
        padding-right:0px;
        padding-bottom:5px;
	}

	#TSClockHistoryButton2 {
        float:left;
		width: 25vw;
        margin-left:0px;
        margin-right:15%;
        padding-right:0px;
        padding-left:0px;
        padding-bottom:5px;
	}

	#TSEntryByRow1 {
		width: 90vw;
        margin-right:50px;
        float:left;
	}

	#TSEntryByRow2 {
		width: 90vw;
        margin-right:1040px;
        float:left;
	}

	#TSEntryByRow3 {
		width: 90vw;
        margin-right:50px;
        float:left;

	}

	#TSEntryByRow4 {
        width:100%;
        float: left;
        position:absolute;
	}

    #EmpPayStubGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

    #EmpPayStubDivGvwPayStub {
        float:left; 
        margin-bottom:2px;
        width:100%;
    }

    #EmpPayStubDivGvwLeaveInformation {
        float:none; 
        padding-left:0px;
        padding-top:0px; 
        margin-right:0%; 
        margin-top:2px;
        width:100%;
    }

	#TSManualPunch1 {
		width: 50%;
	}

	#TSManualPunch2 {
		width: 50%;
	}

	#TSManualPunch3 {
		width: 100%;
	}

	#TSManualPunch4 {
		width: 100%;
        padding-bottom:5px;
	}

    #SendEmail {
        width:90%;
    }

    #SendEmailButtons {
        width:75%;
    }

    #AuditTrailComments {
        width: 100%;
    }

    #AttachmentUpload {
	    width: 100%;
    }

    #AttachmentButtons {
        width:100%;
    }

    #POReceivingDocumentInformation {
    	margin: 12% 0% 0% 0%;
        padding: 0px 0px 0px 5px;
    }

    #ApprovalSubstitution {
        width:100%;
        position: relative;
        top: 0px;
        left: 0px;
        transform:none;
        float:left;
    }

	#TimeClockEntries1 {
		width: 45vw;
        margin-bottom:0px;
	}

	#TimeClockEntries2 {
		width: 45vw;
        margin-bottom:0px;
	}

	#TimeClockEntries3 {
		width: 100vw;
        margin-top:0px;
        margin-left:0px;
        margin-right:65%;
        margin-bottom:5px;
	}

	#POEntryDocNo {
		width: 90vw;
	}

    #POEntryDocNoDescription {
        width:106%;
        float:left;
    }

	#POEntryWorkflowBillToShipTo {
		width: 90vw;
	}

	#POEntryVendorInfo {
		width: 90vw;
        float:left;
        padding-top:0px;
        padding-left: 0px;
        margin-left:0px;
	}

	#POEntryReason {
		width: 90vw;
        margin-left:0px;
	}

	#TSClockHistoryButton1 {
		width: 5%;
        padding-right:5px;
        padding-bottom:0px;
	}

	#TSClockHistoryButton2 {
		width: 5%;
        padding-bottom:0px;
	}

	#EmployeeInfo {
		width: 50vw;
	}

	#EmployeeName {
		width: 84vw;
	}

	#EmployeeAddress {
		width: 84vw;
	}

	#EmployeeOtherDetails {
		width: 84vw;
	}

}


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

	/*html {
		-webkit-text-size-adjust: none;
	}

	#main-nav a {
		font-size: 90%;
		padding: 10px 8px;
	}*/

	#content {
		width: auto;
		float: none;
		margin: 20px 0;
	}

	/*#LeaveRequest1 {
		width: 100%;
		margin: 0px;
		float: none;
	}

	#LeaveRequest2 {
		width: 100%;
		margin: 0px;
		float: none;
	}

	#LeaveRequest3 {
		width: 100%;
		margin: 0px;
		float: none;
	}

	#LeaveRequest4 {
		width: 100%;
		margin: 0px 0px 0px;
        padding-bottom:10px;
		float: none;
	}

    #LeaveRequestchkUseShiftHrs {
        float:left;
        margin-right:0%;
        margin-top:3%;
    }*/

	#TimeClock {
		width: 95%;
	}

	#TimeClockEmail {
		width: 95%;
	}

	#Login {
		width: 95%;
	}

	#LoginEmail {
		width: 95%;
	}

    #ChangePassword {
		width: 95%;
    }

    #divMainTimeClock {
	    width: 100%;
        height:100%;
        position:relative;
        float:left;
    }

    #divMainLogin {
	    width: 100%;
        height:100%;
        position:relative;
        float:left;
    }

    /* vh : viewport height */
    .RoundPanel {
        height:72vh; 
        min-height:90%;
    }

    #divMain {
        width:100%;
        height:90%;
        position:relative;
        float:none;
    }

    /*#HomePage1 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px 0px 2px 0px;
    }*/

    #HomePage2 {
        width:100%;
		float: none;
        margin: 0px;
        padding: 0px;
    }

    #HomePage3 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px 0px 5px 0px;
    }

    #HomePage4 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px 0px 5px 0px;
    }

    #HomePage5 {
        width:auto;
		float: none;
        margin: 0px;
        padding: 0px;
    }

	/*#TSEntryByRow1 {
		width: 95%;
        margin-top:60px;
        margin-right:10px;
        margin-left:0px;
	}

	#TSEntryByRow2 {
		width: 95%;
        margin-top:0px;
        margin-left:0px;
	}

	#TSEntryByRow3 {
		width: 95%;
        float:left;
	}

	#TSEntryByRow4 {
        width:100%;
        float: left;
        position:absolute;
	}*/

    #EmpPayStubGridview {
	    width: 100%;
	    float: left;
	    margin: 0px 0px 0px;
    }

    #EmpPayStubDivGvwPayStub {
        float:left; 
        margin-bottom:2px;
        width:100%;
    }

    #EmpPayStubDivGvwLeaveInformation {
        float:none; 
        padding-left:0px;
        padding-top:0px; 
        margin-right:0%; 
        margin-top:2px;
        width:100%;
    }

	#TSManualPunch1 {
		width: 100%;
	}

	#TSManualPunch2 {
		width: 100%;
	}

	#TSManualPunch3 {
		width: 100%;
	}

	#TSManualPunch4 {
		width: 100%;
        padding-bottom:5px;
	}

}

/* to use */
/*@media only screen and (min-device-width : 210px) and (max-device-width : 320px) {

 	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#sidebar {
		width: 30%;
	}

	#sidebar1 {
		width: 30%;
	}

	#sidebar2 {
		width: 30%;
	}

	#sidebar3 {
		width: 80%;
	}

	#sidebar4 {
		width: 30%;
	}

}*/

/* Smartphones (portrait and landscape) ----------- */
/* to use */
/*@media only screen and (min-device-width : 321px) and (max-device-width : 480px) {

 	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#sidebar {
		width: 30%;
	}

	#sidebar1 {
		width: 30%;
	}

	#sidebar2 {
		width: 30%;
	}

	#sidebar3 {
		width: 80%;
	}

	#sidebar4 {
		width: 30%;
	}

}*/

/* Smartphones (landscape) ----------- */
/* to use */
/*@media only screen and (min-device-width: 360px) and (max-device-height: 640px) {

	#content {
		width: auto;
		float: none;
		margin: 20px 0;
	}

	#sidebar {
		width: 50%;
		margin: 0;
		float: none;
	}

	#sidebar1 {
		width: 50%;
		margin: 0;
		float: none;
	}

	#sidebar2 {
		width: 50%;
		margin: 0;
		float: none;
	}

	#sidebar3 {
		width: 100%;
		margin: 0;
		float: none;
	}

	#sidebar4 {
		width: 100%;
		margin: 0;
		float: none;
	}

}*/



/*@media only screen and (min-width : 321px) {

}*/



/* Smartphones (portrait) ----------- */

/*@media only screen and (max-width : 320px) {

}*/

/* iPads (portrait and landscape) ----------- */
/* to use */
/*@media only screen and (min-device-width : 641px) and (max-device-width : 1024px) {
	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#sidebar {
		width: 30%;
	}

	#sidebar1 {
		width: 30%;
	}

	#sidebar2 {
		width: 30%;
	}

	#sidebar3 {
		width: 80%;
	}

	#sidebar4 {
		width: 30%;
	}

}*/

/* iPads (landscape) ----------- */

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

}*/

/* iPads (portrait) ----------- */

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

}*/

/**********
iPad 3
**********/

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

}*/

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

}*/

/* Desktops and laptops ----------- */
/* to use   */
/*@media only screen  and (min-width : 1224px) {
	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#sidebar {
		width: 30%;
	}

	#sidebar1 {
		width: 30%;
	}

	#sidebar2 {
		width: 30%;
	}

	#sidebar3 {
		width: 80%;
	}

	#sidebar4 {
		width: 30%;
	}

}*/

/* Large screens ----------- */
/* to use */
/*@media only screen  and (min-width : 1824px) {

 	#content {
		width: 60%;
		padding: 3% 4%;
	}

	#sidebar {
		width: 30%;
	}

	#sidebar1 {
		width: 30%;
	}

	#sidebar2 {
		width: 30%;
	}

	#sidebar3 {
		width: 80%;
	}

	#sidebar4 {
		width: 30%;
	}

}*/

/* iPhone 4 ----------- */

/*@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2) {

}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2) {

}*/

/* iPhone 5 ----------- */

/*@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}*/

/* iPhone 6 ----------- */

/*@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}*/

/*@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}*/

/* iPhone 6+ ----------- */

/*@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}*/

/*@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}*/

/* Samsung Galaxy S3 ----------- */

/*@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2){

}*/

/*@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2){

}*/

/* Samsung Galaxy S4 ----------- */
/*@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){

}*/

/*@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){

}*/

/* Samsung Galaxy S5 ----------- */

/*@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3){

}*/

/*@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3){

}*/


@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */

    /*.button {
        font-size:small;
        font-weight: 500;
    }*/

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

        #EmpPayStubGridview {
	        width: 100%;
	        float: left;
	        margin: 0px 0px 0px;
        }

        #EmpPayStubDivGvwPayStub {
            float:left; 
            margin-bottom:2px;
            width:51%;
        }

        #EmpPayStubDivGvwLeaveInformation {
            float:left; 
            padding-left:1px; 
            margin-right:0%; 
            margin-top:0%;
            width:48%;
        }


    }

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

        #EmpPayStubGridview {
	        width: 100%;
	        float: left;
	        margin: 0px 0px 0px;
        }

        #EmpPayStubDivGvwPayStub {
            float:none; 
            margin-bottom:2px;
            width:100%;
        }

        #EmpPayStubDivGvwLeaveInformation {
            float:none; 
            padding-left:0px;
            padding-top:0px; 
            margin-right:0%; 
            margin-top:2px;
            width:100%;
        }

    }

}