.site-logo {
	display: flex;
	width: 20%
}

.menu {
	display: flex;
	width: 80%;
	font-size: 1.2rem;
    flex-direction: row;
	color:black;
	justify-content: flex-end;
}

.HeaderStyle {
	display: flex;
	flex-direction: row;
	height: auto;
	padding: 10px 40px 10px 40px;
	border-bottom: 3px solid #727272;
	background: linear-gradient(45deg, white, #e5e5e5);

}

body {
	margin: 0px;
}

.footerStyle {
	display: flex;
	flex-direction: column;
	border-top: 3px solid #727272;
	background: #ffc31a;
	padding: 15px;
}

#logo-box {
	display: flex;
	width: 60%;
	margin: auto;
}

#menu-box{
	display: none;
	height: 50px;
	margin:auto;
}

.container {
	display: flex;
	min-height: 500px;
}

.menu-link{
	display: flex;
	color: inherit;
	margin: 0 10px 0 10px;
    text-transform: uppercase;
    text-decoration: none;

}

.menu-link:hover{
	color: #dbac00;

}

#logo-top {
	display: flex;
	margin: auto;
}


.menu-block{
    display: flex;
    list-style-type: none;
}

.copy-right {
	display: flex;
	margin: auto;
	top :15px;
}

.social-network-bloc {
	display: flex;
	flex-direction: row;
	margin: auto;
}

.snw-box{
	display: flex;
    height: 40px;
    width: 40px;
    margin: 5px;
}

#facebook-icon {
	background-image: url("../img/social networking/Facebook_2.png");
	background-size: cover;
}

#facebook-icon:hover {
	background-image: url("../img/social networking/Facebook.png");
	background-size: cover;
}

#linkedin-icon {
	background-image: url("../img/social networking/Linkedin_2.png");
	background-size: cover;
}

#linkedin-icon:hover {
	background-image: url("../img/social networking/Linkedin.png");
	background-size: cover;
}

#twitter-icon {
	background-image: url("../img/social networking/Twitter_2.png");
	background-size: cover;
}

#twitter-icon:hover {
	background-image: url("../img/social networking/Twitter.png");
	background-size: cover;
}


#instagram-icon {
	background-image: url("../img/social networking/Instagram_2.png");
	background-size: cover;
}

#instagram-icon:hover {
	background-image: url("../img/social networking/Instagram.png");
	background-size: cover;
}


@media screen and (min-width: 800px){
  #mopao{
	display: flex;

}
}

@media screen and (max-width: 800px) {

.site-logo {
	width: 50%;
}

.menu {
	width: 50%;
}

#menu-box{
	display: flex;
	margin-right: 10px;
	width: 50px;
	height: 50px;
	background-image: url("../img/icon/menu.png") ;
	background-size: cover;
}

.HeaderStyle {
	height: auto;
	padding: 5px;
	border-bottom: 3px solid #727272;
	background: none;
}

#logo-box {
	display: flex;
	width: 80%;
	margin: left;
}

.menu-block{
	display: flex;
	flex-direction: column;
	box-shadow: 0px 1px 2px #CCC;
    background-color: white;
    position: absolute;
    width: 70%;
    z-index: 1000;
    top: 50px;
}

.menu-link {
	height:25px;
	border-bottom: 1px solid #bfbebe;
	padding: 15px;
}

#mopao{
	display: none;
}

}