body{
	background-color:#1e1e1e;
}


body:after{
	position: absolute;
	width: 0;
	height:0;
	overflow:hidden;
	z-index: -1;
	content: url(facebook-color.png) url(instagram-color.png);
}

a {
	cursor: pointer;
}

.header-main{
	width: 100%;
	height: 60px;
	background-color: #fff;
	display: flex;
	flex-direction: row; /*add notes*/
	flex-wrap:wrap;
	justify-content: flex-start;
	align-content:flex-start;
	gap: 50px 40px;
	row-gap:;
	column-gap:;
	align-items center;
}

.header-main div{
	height: 30px;
}


.header-main-logo{
	width: fit-content;
	height: 100%;
	background-color: #00ff00;
	padding-left: 60px;
	display: flex;
}

.header-main-logo img{
	height: 30px;
	align-self:;
}

.header-main-nav{
	width: 120px;
	height: 100%;
	background-color: #000;
}


.header-main-sm{
	width: fit-content;
	height: 100%;
	background-color: #yellow;
}


.header-main-nav ul{
	list-style: none;
	margin-left:30px;
}

.header-main-nav ul li{
	display:inline;
	float: left;
	margin-right: 10px;
}

.header-main-nav ul li a{
	padding: 0 10px;
	font-family: Arial;
	color:#000;
	display: block;
	height:100%;
}
.header-main-nav ul li a:hover{
	color:#ccc;
	
}


.header-main-sm {
	width: fit-content;
	height: 100%;
	background-color: #ff0000;
	padding-right: 60px;
	display: flex;
	align-items: center;
	column-gap: 10px;
}

.header-main-sm-fb{
	width: 30px;
	height: 30px;
	background-image: url(facebook.png);
	background-repeat: no-repeat;
	background-size:cover;
}

.header-main-sm-fb:hover{
	background-image: url(facebook-color).jpg;
}
.header-main-sm-in{
	width: 30px;
	height: 30px;
	background-image: url(instagram.jpg);
	background-repeat: no-repeat;
	background-size:cover;
}

.header-main-sm-in:hover{
	background-image: url(instagram-colorcolor.jpg);
}