*{
margin: 0px;
padding: 0px;
}
body{
background: White;
}
#header{
width: 100%;
height: 100px;
background: #F2F2F2;
position :fixed;top:0px;
box-shadow: 0px 2px 4px gray;

}
/* centered columns styles */
.row-centered {
    text-align:center;
}

#button {
    width: 6em;
    border: 0px solid green;
    background: #ffe;
    border-radius: 5px;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-2px;
    text-align: center;
    background-color: #ccc;
    border: 1px solid #ddd;
}
#logo{
width:200px;
height: 80px;
float: left;
padding-left:40px;
}
#navbar{
	
width:1000px;
height: 80px;
margin: 0px auto;
float: right;

}
#navbar>li{
float: left;
list-style: none;
width: 190px;height: 80px;

}
li>a{
text-decoration: none;
color: black;
font-family: cursive;
font-size: 20px;
line-height: 80px;
display: block;
text-align: center;

}
li>a:hover,
li>a:focus{
background: white;
color: #333;
}
#res_btn{
width: 50px;
height: 50px;
float: right;
display: none;
}
@media screen and (max-width:1260px){
#logo>img{
width:150px;
height: 60px;
float: left;
padding-left:20px;
padding-top: 10px;
}
#navbar{
width:800px;
height: 80px;
margin: 0px auto;
float: right;
hnmnn 
}
#navbar>li{
float: left;
list-style: none;
width: 150px;
height: 80px;
border-right:1px solid #534444;
border-left: 1px solid #534444;
}
li>a{
text-decoration: none;
color: white;
font-family: cursive;
font-size: 20px;
line-height: 80px;
display: block;

text-align: center;
}
}
@media screen and (max-width:1060px){
#header{
width: 100%;
height: 0px;
height: 0px;
background: #F2F2F2;
box-shadow: 0px 2px 4px gray;
position:fixed;top:80px;
}
#logo{
width:100%;
height: 90px;
float: left;
padding-left:20px;
padding-top: 10px;
position: absolute;
top:-90px;
background: white;
}
#navbar{
width:100%;
height: 60px;
margin: 0px auto;
}
#navbar>li{
width: 18%;
}
li>a{
font-size: 16px;
}
}
@media screen and (max-width:768px){
#header{height: 50px;}
#navbar{width:100%;height: 50px;margin: 0px auto;}
#navbar>li{width: 19%;height: 50px;}
li>a{font-size: 16px;line-height: 50px;}
}
@media screen and (max-width: 480px){
#header{
height: 0px;

}
#navbar{
width:100%;
height: 50px;
margin: 0px auto;
margin-top:-40px;
display: none;
}
#navbar>li{
float: none;
list-style: none;
width: 100%;
height: 50px;
background: #333;
border-bottom: 1px solid grey;
}
li>a{
font-size: 16px;
line-height: 50px;
}
#res_btn{
display: block;
position: relative;
top:-80px;
cursor: pointer;
}


}