#banner1 {position:relative;margin: 0 auto}
#banner1 a {position:absolute;top:0px;left:0px;}
#nav2{position:relative;z-index:99;left:48%;top:-10px;width:150px;height:20px;background-color: #ffffff;color: #ffffff;}   
#nav2 a{display:block;width:22px;height:22px;background:url(dot.png) no-repeat;background-position: -10px -10px;text-indent:-9999px;border:0;padding:0;margin-right:3px;float:left; }
#nav2 a.activeSlide{background-position: -10px -32px;}

@media only screen and (min-width: 1001px)  {
#banner1 a img {width:100%;max-width:1000px;}
}

@media only screen and (min-width: 960px) and (max-width: 1000px) {
#banner1 a img {width:96%;max-width:1000px;height:96%;}
}

@media only screen and (min-width: 769px) and (max-width: 960px) {
#banner1 a img {width:80%;max-width:960px;height:80%}

}

@media only screen and (min-width: 601px) and (max-width: 768px) {
#banner1 a img {width:70%;max-width:768px;height:70%}
}

@media only screen and (min-width: 481px) and (max-width: 600px) {
#banner1 a img {width:50%;max-width:600px;height:50%}

}

@media only screen and (min-width: 321px) and (max-width: 480px) {
#banner1 a img {width:35%;max-width:480px;height:35%}
}

@media only screen and (max-width: 320px) {
#banner1 a img {width:25%;max-width:320px;height:25%}

}