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

	.column,.col2,.col3{
		width: 95% !important;
	}
	.column,.col3{
		height: auto !important;
	}		
}
		.header {
            padding: 0;
            margin: 0;
            text-align: center;
            font-size: 15px;
        }
		
		.textbox {
		width:200px;
        padding: 15px 20px;
		border: 2px solid black;
        border-radius: 10px;
		}
		.textbox:hover{
			border: 2px solid black;
		}
		.textbox:focus{
			outline: none;
		}
		
		
		.charbox {
			width: 35px;
			height: 20px;
			padding: 5px 5px;
			border: 1.5px solid black;
			margin-left:3px;
			font-weight:bold;
			font-size:15px;
		}
		
		.ascbox {
			width: 25px;
			height: 20px;
			padding: 5px 5px;
			border: 1.5px solid blue;
			margin-left:3px;
			font-weight:bold;
			color:blue;
			font-size:12px;
		}
		
		.cbox {
			width: 25px;
			height: 30px;
			padding: 5px 10px;
			border: 1px solid black;
			margin-left:3px;
			font-weight:bold;
			font-size:20px;
			border-radius:50%;
		}
		
		.eqlbox {
			width: 37px;
			height: 30px;
			padding: 5px 5px;
			border: 1px solid white;
			margin-left:3px;
			font-weight:bold;
			font-size:20px;
		}
		
	
		.btn-next{
			background-color: rgb(39, 38, 38);
			background-color: royalblue;
			color: white ;
			padding:15px 35px;
			border: none;
			border-radius: 5px;
		}
		.btn-next:hover{
			cursor: pointer;
			background-color:green;
			color: white;
			box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.3);
			transform: translateY(-1px);
		}
	
	.btn-rst{
		background-color: rgb(39, 38, 38);
		background-color: royalblue;
		color: white ;
		padding:15px 35px;
		border: none;
		border-radius: 5px;
	}
	.btn-rst:hover{
		cursor: pointer;
		background-color:red;
		color:white;
		box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.3);
		transform: translateY(-1px);
	}
.btn-dec{
			background-color: rgb(39, 38, 38);
			background-color: royalblue;
			color: white ;
			padding:15px 20px;
			border: none;
			border-radius: 5px;
		}
		.btn-dec:hover{
			cursor: pointer;
			background-color:green;
			color: white;
			box-shadow: 0px 0px 10px 1px rgba(0,0,0,0.3);
			transform: translateY(-1px);
		}

	.column {
            float: left;
            width: 27%;
            padding: 10px;
            height: 600px;
            border: medium solid #000000;
	    border-radius: 2%;
	    overflow-x:auto;
		margin: 1px;
            margin-left: 2px;
        }
        .col2{
                width: 43%;
		overflow-x:auto;
		margin: 1px;
        }
        .col3{
            width: 22%;
		    margin: 1px;
        }
		.enccol {
            float: left;
            width: 44%;
		overflow-x:auto;
            margin-left: 20px;
        }
        .enccol2{
                width: 44%;
				overflow-x:auto;
        }

        .row:after {
            content: "";
            display: table;
            clear: both;
        }
		
		.codetable{
    background-color: whitesmoke; 
    margin: 0px 0px 12px 12px; 
    padding: 12px 12px 12px 12px; 
    border-radius: 0px;
    font-size: 13px;
	border-color:1px solid black;
	border-collapse: separate;
}