* {
  box-sizing: border-box;
}
.brand_nav{
	font-family: "Rooster";
margin-top:-36px;
margin-bottom: 16px;

}
.brand_nav a{
	color: #f9f9f9;
	font-size: 18px;
	text-decoration: none;
	font-weight: 600;

}

.navigation {
  display: flex;
  flex-wrap: wrap;
  text-align: center;
  width:100%;
height:140px;
}

.brand_nav a:hover{
	color: #ccc;
}
.link1, .link2, .link3, .link4 {
padding: 58px 0 0 ;
  flex: 18%;
}

.logo {
height: 140px;
width:320px;
  flex: 28%;

}
  .top_logo {
display:none
}
.brand_nav .active{
	font-weight: 600;
}

@media (max-width: 1200px) {

.brand_nav{
	font-family: "Rooster";
margin-top:-42px;

}
.brand_nav a{
	font-size: 16px;
}

.brand_nav .navigation {
height:110px;
}

.link1, .link2, .link3, .link4 {
padding: 46px 0 0 ;
  flex: 14%;
}

.brand_nav .logo {
width:260px;
height: 110px;
  flex: 24%;

}

}

@media (max-width: 900px) {
.brand_nav a{
	font-size: 16px;
}

.brand_nav{
margin-top:0;
}
.brand_nav .navigation {
height:auto;
padding-bottom:8px;
}
.brand_nav .link1, .link2, .link3, .link4 {
padding: 4px 0 ;
  flex: 50%;
}

.brand_nav a{
	font-size: 14px;
}

.brand_nav .logo {
display:none
}
.brand_nav .top_logo {
display:block;
min-width: 100%;
text-align: center;
height:auto;
}
}
@media (max-width: 560px) {

.brand_nav .link1 {
  	padding:0 0 8px 0;
    flex: 100%;
  }

.brand_nav .link2, .link3, .link4 {
padding:4px 0 8px 0;
    flex: 100%;
  }
}