body{
	background-color:#b35f5f;
}


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: #00ff00;
	display: flex;
	flex-direction: row; /*add notes*/
	flex-wrap:wrap;
	justify-content: space-between;
	display: flex;
	align-items: center;
}

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


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

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

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


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


.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;
	line-height: 30px;
	color:#bc3a3a;
	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.jpg);
}
.header-main-sm-in{
	width: 30px;
	height: 30px;
	background-image: url(instragram-color.png);
	background-repeat: no-repeat;
	background-size:cover;
}

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