a{
            color: #06357a;

        }
        a:hover {
            color: #a20590;
        }
        .pagination a{
            padding: .375rem .75rem;
            border:1px solid #dee2e6;
            text-decoration: none;

        }
        .pagination a:hover {
            text-decoration: none;
            box-shadow: 0 0 16px rgba(74, 135, 33, 0.4);
            background-color: #f2f3abde;
        }
        .pagination .active a{
            color:crimson;
            box-shadow: 0 0 16px rgba(74, 135, 33, 0.4);
            background-color: #f2f3abde;
        }
        .pagination{
            width: 50%;
             display: flex;
             align-items: center;
             /* justify-content: space-between; */
             list-style: none;
            
           }
           
        .list {
            font-family:sans-serif;
        }

        /*        td {
                    padding:10px; 
                    border:solid 1px #eee;
                }*/

        input {
            border:solid 1px rgb(112, 58, 58);
            border-radius: 145px;
            padding:7px 14px;
            margin-bottom:10px
        }
        input:focus {
            outline:none;
            border-color:#aaa;
        }
        .sort {
            padding:5px 30px;
            border-radius: 6px;
            border:none;
            display:inline-block;
            color:#fff;
            text-decoration: none;
            background-color: #28a8e0;
            height:30px;
        }
        .sort:hover {
            text-decoration: none;
            background-color:#1b8aba;
        }
        .sort:focus {
            outline:none;
        }
        .sort:after {
            display:inline-block;
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-bottom: 5px solid transparent;
            content:"";
            position: relative;
            top:-10px;
            right:-5px;
        }
        .sort.asc:after {
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-top: 5px solid #fff;
            content:"";
            position: relative;
            top:4px;
            right:-5px;
        }
        .sort.desc:after {
            width: 0;
            height: 0;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
            border-bottom: 5px solid #fff;
            content:"";
            position: relative;
            top:-4px;
            right:-5px;
        }
        .test{
            list-style: none;
            padding: 0;
            margin-top: 10px;

        }
        
.search,.close-icon {
	position: relative; 
	 padding: 10px;
}

.search {
	/* width: 80%;
	border: 1px solid #ccc;
  /* outline: 0; */
  /* border-radius: 15px; */ 
}
.search:focus {
	box-shadow: 0 0 15px 2px #b0e0ee;
	border: 2px solid #bebede;
}
.close-icon {
	border:1px solid transparent;
	background-color: transparent;
	display: inline-block;
	vertical-align: middle;
  outline: 0;
  cursor: pointer;
}
.close-icon:after {
	content: "X";
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	background-color: #FA9595;
	z-index:1;
	right: 35px;
	top: 0;
	bottom: 0;
	margin: auto;
	/* padding: 1px; */
	border-radius: 50%;
	text-align: center;
	color: white;
	font-weight: normal;
	font-size: 12px;
	box-shadow: 0 0 2px #E50F0F;
	cursor: pointer;
}
.search:not(:valid) ~ .close-icon {
	display: none;
}