@charset "UTF-8";
/* CSS Document */



  
  
  /* Desktops and laptops ----------- */
@media only screen 
and (min-width : 500px) {


#header1 {
max-width: 910px;
width: 100%;
margin: 0 auto;
margin-bottom: 1px;
position: relative;
float: right;
}
#header1 #sidenav {
  max-width:280px;
  width:100%;
  height:auto;
  position:relative;
  padding:0 10px;
  float:left;
  z-index:20;
  margin-left:-10px;
  background:url(images/index/side_s.png) top left repeat-y;
}

ul#nav {
  position:relative;
  width:280px;
  height:auto;
  background:#fff;
  padding:1px 0;
  }

ul#nav li {
  display:block;
  height:32px;
}

ul#nav li a {
  background:url(images/buttons/navigation.jpg) top left no-repeat;
  float:left;
  color:#555555;
  height:26px;
  width:219px;
  margin-left:1px;
  padding:6px 0 0 60px;
  font-size:13px;
  cursor: pointer;
  text-shadow: #fff 0px 1px 0;
  border-bottom:1px solid #cecece;

  }

ul#nav li a:hover {
  background-position:bottom left;
  color:#b9b9b9;
  text-shadow: #082a1c 0px 1px 0;
}

ul#nav li {
  height: auto;
}


ul#nav li a.selected {
  background-position:bottom left;
  color:#b9b9b9;
  text-shadow: #082a1c 0px 1px 0;
}

ul#nav li ul {
  margin: 0px;
  padding: 0px;
  top: 0px;
  position: relative;
}

ul#nav li ul li a {
  background:#fff;
}

ul#nav li ul li a:hover {
  color:#000;
  text-decoration:underline;
  text-shadow:none;  
}

}



/* Smartphones (portrait and landscape) ----------- */
@media (max-width: 480px)  {

#header1 {
max-width: 910px;
width: 100%;
margin: 0 auto;
margin-bottom: 1px;
position: relative;
float: right;
}

#header1 #sidenav {
  max-width:280px;
  width:100%;
  height:auto;
  position:relative;
  padding:0 10px;
  float:left;
  z-index:20;
  margin-left:-10px;
  background:url(images/index/side_s.png) top left repeat-y;
  padding-left: 45px;
}

ul#nav {
  position:relative;
  width:280px;
  height:auto;
  background:#fff;
  padding:1px 0;
  }

ul#nav li {
  display:block;
  height:32px;
}

ul#nav li a {
  background:url(images/buttons/navigation.jpg) top left no-repeat;
  float:left;
  color:#555555;
  height:26px;
  width:219px;
  margin-left:1px;
  padding:6px 0 0 60px;
  font-size:13px;
  cursor: pointer;
  text-shadow: #fff 0px 1px 0;
  border-bottom:1px solid #cecece;

  }

ul#nav li a:hover {
  background-position:bottom left;
  color:#b9b9b9;
  text-shadow: #082a1c 0px 1px 0;
}

ul#nav li {
  height: auto;
}


ul#nav li a.selected {
  background-position:bottom left;
  color:#b9b9b9;
  text-shadow: #082a1c 0px 1px 0;
}

ul#nav li ul {
  margin: 0px;
  padding: 0px;
  top: 0px;
  position: relative;
}

ul#nav li ul li a {
  background:#fff;
}

ul#nav li ul li a:hover {
  color:#000;
  text-decoration:underline;
  text-shadow:none;  
}

}