button {
    padding: 8px 20px;
    border: 1px solid #CCC;
    border-radius: 20px;
        cursor: pointer;
        margin: 0 5px;
}
input#searchInput {
    padding: 5px 10px;
    border: 1px solid #CCC;
    border-radius: 20px;
}
div#studentpagination button{
   background:rgb(27, 74, 40);
   color:#FFF;
}
div#studentpagination button:disabled{
   background:rgba(27, 74, 40,.5);
   cursor: default;
}
.listmode {
    float: right;
    padding: 20px;
}
.listmode a {
    display: inline-block;
    padding: 10px;
}
.listmode a path {
    fill: #ECECEC;
}
.listmode a.active path {
    fill: cadetblue;
}
#studentTable{
	width:100%;
	margin-top:40px;
}
div#studentpagination {
    text-align: center;
    margin-top: 30px;
}
table#studentTable img {
    height: 200px;
    width: 150px;
    object-fit: cover;
    border-radius:15px;
}
table#studentTable thead th{
	font-size:14px;
	text-align:left;
}
table#studentTable td{
	padding:10px;
}
table#studentTable td:nth-child(1){
	width:170px !important;
	text-align: center;
	padding:0;
}
table#studentTable td:nth-child(1),table#studentTable th:nth-child(1){
	display:none;
}
table#studentTable tbody tr:nth-child(2n) {
    background: #F2f2f2;
}

table#studentTable.showhead thead{
	display:none;
}
table#studentTable.showhead td:nth-child(1){
	display:block;
}
table#studentTable.showhead tbody {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 100%;
}
table#studentTable.showhead tbody tr {
    margin-bottom: 10px;
}
table#studentTable.showhead tbody tr td {
	  float: left;
    width: calc(100% - 200px);
    color:#999;
    padding:0 10px;
    line-height: 140%;
    margin-bottom: 5px;
}
table#studentTable.showhead tbody tr td:nth-child(1) {
	padding-left:0;
	position:relative;
	min-height:200px;
}
table#studentTable.showhead tbody tr td:nth-child(1):after {
    background: url(../../teachernopic.jpg) center center;
    background-size:contain;
    content: "";
    width: 150px;
    height: 200px;
    position: absolute;
    left: 10px;
    z-index: 0;
    border-radius:15px;
}
table#studentTable.showhead tbody tr td:nth-child(1) img{
	position:relative;
	z-index:1;
}
table#studentTable.showhead tbody tr:nth-child(2n) {
    background: #FFF;
}
table#studentTable.showhead tbody tr td:nth-child(2){
	font-size:20px;
	font-weight:600;
	color:#697E47;
	margin-bottom:10px;
}
table#studentTable.showhead tbody tr td:nth-child(4):before {
    content:"\5e74\7ea7\ff1a";
}
table#studentTable.showhead tbody tr td:nth-child(6):before {
    content:"\5bfc\5e08\ff1a";
}
table#studentTable.showhead tbody tr td:nth-child(7):before {
    content:"\7814\7a76\65b9\5411\ff1a";
}