* {
	font-family: Arial;
}
body {
	display: flex;
    flex-direction: column;
    margin: 0;
    height: -webkit-fill-available;
}
#wrapper {
    display: flex;
    flex-direction: row-reverse;
    align-content: space-around;
    flex-wrap: nowrap;
    justify-content: flex-end;
}
#wrapper #openBtn {
	cursor: pointer;
    padding: 8px 15px;
    border: none;
    background-color: transparent;
    font-size: 22px;
    font-weight: bolder;
    display: inline-block;
    float: left;
}
#header {
	display: inline-block;
    width: 100%;
    background-image: linear-gradient(180deg, #83c2ff, #6cacea);
}
#header .icon2 {
	font-size: 29px;
	margin: 9px 20px;
	float: right;
	color: #f2dede;
}
#header li {
	list-style-type: none;
}
#header .icon {
	font-size: 29px;
    color: #f2dede;
    float: right;
    padding: 8px 5px;
}
#container {
	width: 100%;
    display: block;
}
#container #content {
	margin: 0;
	padding: 30px 40px;
}
#sidebar{
	background-color: #394b58;
    position: relative;
    width: 20%;
    display: flex;
    height: auto;
    flex-direction: column;
}
#sidebar #closeBtn {
	position: absolute;
	right: 0;
}
hr {
	margin: 15px 0px;
}
#sidebar button {
	background-color: transparent;
    font-size: 22px;
    border: none;
    margin: 10px 7px;
    
    color: white;
    cursor: pointer;
}
#sidebar #content {
	margin: 50px 0px;
    width: 100%;
}
#sidebar #profile {
	    margin: 10px 5px;
}
#sidebar img {
	width: 50px;
	display: inline-block;
}
#sidebar h4 {
	margin: 0;
}
table {
	color: white;
}
#function a {
	color: white;
	text-decoration: none;
	text-align: center;
}
#function h4{
	color: black;
    font-size: 18px;
    font-weight: bold;
}
#function i {
	font-size: 25px;
}
#function #style1 {
	color:black; 
	padding: 23px 0px;
}
#function hr {
	margin: 0;
	padding: 0;
}
.error {
	background-color: #ccc;
	text-align: center;
	font-weight: bold;
}
.cards{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 2rem;
	margin-top: 1rem;
}
.card-single{
	display: flex;
	justify-content: space-between;
	background: #e0e0e0;
	padding: 2rem;
	border-radius: 2px;
}
.card-single h1{
	color: darkmagenta;
	font-size: 20px;
}
.card-single div span{
	color: grey;
}