.card-container {
		border-radius: 5px;
		box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.75);
		position: relative;
		width: 255px;
		max-width: 100%;
		text-align: center;

		display: inline-block;
	
	margin: 10px;
}

.card-container a {
	color: #000000;
}



.card-container .i_left,
.card-container .i_center {
		border-radius: 10px;

		font-size: 18px;

		position: absolute;
		top: 20px;

		width: 60px;
		height: 50px;

		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
}


.card-container .i_left {
		background: linear-gradient(45deg, #9999ff, #66ffee);
		left: 20px;
		font-weight: bold;

}

.card-container .i_center {
		background: linear-gradient(315deg, #ff6666, #eeff66);
		left: 85px;
}
.card-container .i_center small {
		font-size: 10px;
}



.card-container .i_right {
		position: absolute;
		top: 20px;
		right: 20px;
		width: 50px;
		height: 50px;
		background: linear-gradient(45deg, #000066, #ff3366);
		box-shadow: 0 2px 5px 0px rgba(0, 0, 0, .2);
		cursor: pointer;
		border-radius: 50%;
		transition: 0.3s;
	
	color: #ccc;
	
	display: flex;
    justify-content: center;
    align-items: flex-start;
}

.card-container .i_right > span {
	font-size: 14px;
}
.card-container .i_right > span small {
	font-size: 12px;
}

.card-container .i_right:hover {
		bottom: 0;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
		box-shadow: none;
		opacity: 0.9;
		border-radius: 0;
}
.card-container .i_right:hover > span {
		display: none;
}

.card-container .i_right .r_inter {
		padding: 10px;
		box-sizing: border-box;
		z-index: 1;
		visibility: hidden;
	
		opacity: 0;
		height: 0px;
		overflow: hidden;
	
		transition: 0s;
		color: #fff;
		position: absolute;
		top: 0;
	
	width: 100%;
}
.card-container .i_right:hover .r_inter {
		visibility: visible;
	
		opacity: 1;
		height: 100%;
		overflow:hidden;
	
		transition: 0.2s;
		transition-delay: 0.3s;
}


.card-container .i_right .r_inter a {
		display: inline-block;

		background-color: #ffffff;
		border: 1px solid #03a9f4;
		border-radius: 3px;
		padding: 5px 5px;
		
		margin: 3px;
}

.card-container .i_right .r_inter table{
	width: 100%;
	border: 1px solid #cccccc;
	border-bottom: 0px;
}
.card-container .i_right .r_inter table td{
	border-bottom: 1px solid #cccccc;
	border-right: 1px dotted #cccccc;
}
.card-container .i_right .r_inter table td:before{
	content: '';
	display: inline-block;
}
.card-container .i_right .r_inter table td:last-child{
	border-right: 0px;
}








.card-container .i_data {
		margin: 80px 10px 10px;

		display: flex;
		justify-content: space-between;
}
.card-container .i_data span {
		border-top: 1px solid gray;
}
.card-container .i_data span:first-child {
		width: 145px;
}
.card-container .i_data span:last-child {
		width: 70px;
		font-size: 12px;
		color: #999
}





.card-container .i_content {
	text-align: left;
	margin: 0px 3px;
}
.card-container .i_content table{
	width: 100%;
	border: 1px solid #cccccc;
	border-bottom: 0px;
}
.card-container .i_content table td{
	border-bottom: 1px solid #cccccc;
	border-right: 1px dotted #cccccc;
}
.card-container .i_content table td:before{
	content: '';
	display: inline-block;
}
.card-container .i_content table td:last-child{
	border-right: 0px;
}



.card-container .buttons {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-evenly;
		margin: 5px 0;
}
.card-container .buttons .primary {
		background-color: #03BFCB;
		border: 1px solid #03BFCB;
		border-radius: 3px;
		padding: 10px 5px;
		margin-bottom: 5px;
	
		cursor: pointer;
	
	/*
	display: flex;
    flex-wrap: wrap;
    align-content: center;
	*/
}


.card-container .buttons .primary.cancel {
		background-color: #FF9800;
}


.card-container .buttons .primary:hover {
	box-shadow: 0 2px 5px 2px rgba(0, 0, 0, .2);
}