#headline { 
background:#2c8cb9;
color:#FFF;
width:100%; 
padding:15px 0;
margin:0;
line-height:16px;
font-size:12px;
font-weight:400;
text-align:center;
letter-spacing:1px;
}

#headline a { color:#FFF; text-decoration:none; }

#top-wrapper {
z-index:9999;
background-color:#FFF;
min-height:90px;
width:100%;
margin:0;
padding:0;
border-bottom:8px solid #DDD;
}

#top-content {
width:90%; 
padding:0 5%;
max-width:1200px;
margin:0 auto;
min-height:90px;
line-height:90px;
}

#logo {
float:left;
width:auto;
height:52px;
margin:23px 0 0 0;
padding:0;
}

#logo img {
height:52px;
}

a.menu-link { display: none; }
.js nav[role=navigation] { max-height:none; margin:0; padding:0; }


nav[role=navigation] ul {
float:right;
margin:0;
padding:0;
border:0;
}
			
nav[role=navigation] li {
display:inline-block;	
list-style:none;
height:90px;
line-height:90px;
margin:0;
padding:0;
}

nav[role=navigation] li a {
display:block;
height:90px;
line-height:90px;
font-size:14px;
font-weight:300;
color:#555;
letter-spacing:1px;
text-decoration:none;
padding:0 13px;
-webkit-transition: all 0.1s ease-out;  
-moz-transition: all 0.1s ease-out;
-ms-transition: all 0.1s ease-out;
-o-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
}	

nav[role=navigation] li a:hover { 
background:#FFF; 
border-bottom:8px solid #2c8cb9;
}



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

#top-wrapper {
z-index:9999;
background-color:#FFF;
min-height:70px;
width:100%;
margin:0;
padding:0;
border-bottom:8px solid #DDD;
}
		
#top-content {
width:100%; 
padding:0;
max-width:1200px;
margin:0 auto;
min-height:70px;
line-height:70px;
}

#logo {
float:left;
width:auto;
height:40px;
margin:15px 0 0 15px;
padding:0;
}

#logo img {
height:40px;
}

a.menu-link { display: none; }
.js nav[role=navigation] { max-height:none; margin:0; padding:0; }
		
a.menu-link {
float: right;
display: block;
background:#FFF;
height:70px;
line-height:70px;
margin:0;
padding:0 5% 0 0;
font-size:14px;
font-weight:300;
color:#555;
letter-spacing:1px;
text-decoration:none;
text-align:center;
}

nav[role=navigation] {
clear: both;
-webkit-transition: all 0.3s ease-out;  
-moz-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
		
.js nav[role=navigation] {
overflow: hidden;
max-height: 0;
padding:0;
margin:0;
}
		
nav[role=navigation].active {
max-height:100%;
}
		
nav[role=navigation] ul {
float:left;
background:#FFF;
width:100%;
padding:0 0 8px 0;
margin:0;
}

nav[role=navigation] li {		
list-style:none;
height:50px;
width:100%;
line-height:50px;
padding:0;
margin:0;
}

nav[role=navigation] li a {
display:block;
width:100%;
height:50px;
line-height:50px;
font-size:15px;
font-weight:300;
color:#555;
letter-spacing:1px;
text-decoration:none;
padding:0 8%;
margin:0;
-webkit-transition: all 0.1s ease-out;  
-moz-transition: all 0.1s ease-out;
-ms-transition: all 0.1s ease-out;
-o-transition: all 0.1s ease-out;
transition: all 0.1s ease-out;
}

nav[role=navigation] li a:hover { 
background:#EEE; 
border-bottom:8px solid #2c8cb9;
}

}