/*

	CSS for KCS Portal
	Copyright 2021
	Robbie Rae Solis Dela Cruz

*/

/*~Page Footer Style~*/

	.page-footer{
		color: #222222;
		width: 100%;
		height: auto;
		min-height: 100px;
		position: relative;
		background-color: #EEEEEE;
		display: table;
		text-align: center;
		vertical-align: top;
		border-top-width: 5px;
		border-top-color: #f2ff69;
		border-top-style: solid;
	}
	
	.page-footer-information{
		display: table;
		width: 100%;
		text-align: center;
		vertical-align: top;
	}
	
	.page-main-footer-holder{
		display: inline-table;
		box-sizing: border-box;
		width: 24.5%;
		text-align: left;
		vertical-align: top;
	}
	
	.page-app-footer-holder{
		display: inline-table;
		box-sizing: border-box;
		width: 48%;
		text-align: left;
		vertical-align: top;
	}
	
	.page-footer-content{
		height: auto;
		width: auto;
		margin: 10px;
		padding: 16px;
		overflow: hidden;
		vertical-align: top;
	}
	
	.page-footer-title{
		font-size: 16px;
	}
	
	.page-footer-link{
		color: #06417b;
		cursor: pointer;
		padding: 2.5px;
		font-size: 12px;
	}
	
	.page-footer-link:hover{
		color: #ff7a59;
		cursor: pointer;
	}
	
	.page-footer-socnet{
		background-color: #FFFFFF;
		-moz-border-radius: 50%;
		border-radius: 50%;
		padding: 3px;
	}
	
	.page-footer-socnet:hover{
		background-color: #DDDDDD;
		cursor: pointer;
	}
	
/*~Page Media Style~*/

	@media all and (min-width: 1321px) { /*for desktop response*/
		.page-footer-information{
			display: table;
			width: 100%;
			text-align: center;
		}
		
		.page-footer-holder{
			width: 24.5%;
		}
		
		.page-footer-holder{
			width: 48%;
		}
	}
	
	@media all and (min-width: 1221px) and (max-width: 1320px) { /*for laptop response*/
	    .page-footer-information{
			display: table;
			width: 100%;
			text-align: center;
		}
		
		.page-main-footer-holder{
			width: 24.5%;
		}
		
		.page-app-footer-holder{
			width: 48%;
		}
	}
	
	@media all and (min-width: 541px) and (max-width: 1220px) { /*for tablet response*/
		.page-footer-information{
			display: table;
			width: 100%;
			text-align: center;
		}
		
		.page-main-footer-holder{
			width: 48%;
		}
		
		.page-app-footer-holder{
			width: 48%;
		}
	}
	
	@media all and (max-width: 540px) { /*for mobile response*/
		.page-footer-information{
			display: table;
			width: 100%;
			text-align: center;
		}
		
		.page-main-footer-holder{
			width: 98%;
		}
		
		.page-app-footer-holder{
			width: 98%;
		}
	}