@charset "utf-8";

@media only screen and (max-width: 1900px) {
	.modal {
		position: fixed;
		z-index: 1;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		width: calc(100% - 2 * calc(50% - 390px));
		padding-top: 10px;
		padding-right: calc(50% - 390px);
		padding-bottom: 0px;
		padding-left: calc(50% - 390px)
	}
	#pdf-container {
		width: 100%;
		height: 100%;
		max-height: 80vh;
		max-width: 90vw;
		overflow: auto;
		padding: 10px;
	}
	.close {
		color: #aaa;
		float: right;
		font-size: 20px;
		font-weight: bold;
		padding: 5px;
		border-radius: 10px;
		border-color: #aaa;
	}
	.modal-header {
		background-image: linear-gradient(to right, #89c989, #013d01);
		padding: 10px;
		height: 40%;
		border-top-left-radius: 15px;
		border-top-right-radius: 15px;
	}
	.modal-header-title {
		font-size: 30px;
		font-weight: bold;
		padding: 10px;
		width: auto;
		color: white;
		font-family: 'Times New Roman', serif;
	}
}

@media only screen and (max-width: 700px) {
	.modal {
		position: fixed;
		z-index: 1;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		width: calc(100% - 40px);
		padding-top: 10px;
		padding-right: 20px;
		padding-bottom: 0px;
		padding-left: 20px;
	}
	.close {
		color: #aaa;
		float: right;
		font-size: 20px;
		font-weight: bold;
		padding: 5px;
		border-radius: 10px;
		border-color: #aaa;
	}
	.modal-header {
		background-image: linear-gradient(to right, #89c989, #013d01);
		padding: 10px;
		height: 40%;
		border-top-left-radius: 15px;
		border-top-right-radius: 15px;
	}
	.modal-header-title {
		font-size: 30px;
		font-weight: bold;
		padding: 10px;
		width: auto;
		color: white;
		font-family: 'Times New Roman', serif;
	}
}

@media only screen and (max-width: 280px) {
	.modal {
		position: fixed;
		z-index: 1;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.5);
		width: calc(100% - 40px);
		padding-top: 10px;
		padding-right: 20px;
		padding-bottom: 0px;
		padding-left: 20px;
	}
	.close {
		color: #aaa;
		float: right;
		font-size: 10px;
		font-weight: bold;
		padding: 5px;
		border-radius: 10px;
		border-color: #aaa;
	}
	.modal-header {
		background-image: linear-gradient(to right, #89c989, #013d01);
		padding: 10px;
		height: 20px;
		border-top-left-radius: 15px;
		border-top-right-radius: 15px;
	}
	.modal-header-title {
		font-size: 30px;
		font-weight: bold;
		padding: 10px;
		width: auto;
		color: white;
		font-family: 'Times New Roman', serif;
		display: none;
	}
}