* {margin:0;padding:0;color:#000000;}
body {background:url('images/bg-body.jpg') no-repeat;background-color:#E5E5E5;}
#container {width:960px;margin:30px auto;margin-top: 0px;}
#header {width:100%;margin-bottom: 1%;height: 200px;text-align: right;}
#content {float:left;width:78%;min-height: 400px;}
#navigation {float:left;width:20%;margin-right:2%;background:url('images/bg-navi.jpg') repeat;}
#footer {background-color:#7A0000;width:100%;margin-top: 1%;}


#container-foot {width:960px;margin:30px auto;margin-top: 0px;margin-bottom: 0px;}

div.clear {clear:both;width:1px;height1px;}

p, h1, h2, h3, h4, h5, h6 { padding: 5px;}

.brown {color:#7B0100;}

img { max-width: 100%; height: auto;}

ul.navi { display: block; list-style-type: none; margin: 0px; width: 100%; }
ul.navi li a { display:block; padding: 10px 10px; margin: 0px 2px 10px 2px; background-color:#CCC; border:1px solid #000; }
ul.navi li a:hover { background-color:#7A0000; color:#FFFFFF; border:1px solid #000; }
ul.navititel li.navititel { display: block; list-style-type: none; margin: 0px; height: 0px; overflow: hidden;}
ul.backfor {display:inline-block;list-style-type: none; margin-right: 10px;float:right;}
ul.backfor li.backfor a { float: left;display:block; padding: 10px 20px; margin:0px; border:none;text-align:center;background-color:#CCCCCC;}
ul.backfor li.backfor a:hover { float: left;background-color:#7A0000; color:#FFFFFF; border:none;text-align:center;}

.text-right {text-align: right;}
.foot-text { text-align: right; color:#FFFFFF;}

a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:hover { text-decoration:none;}
a.foot-link:link { text-decoration: none;color:#FFFFFF;}
a:visited {text-decoration: none;color:#FFFFFF;}
a.foot-link:hover { text-decoration:none;color:#E5E5E5;}


@media only screen and (max-width: 1024px) {
body {background:url('images/bg-body.jpg') no-repeat;background-color:#E5E5E5;}
#container { width:100%; margin: 0px;}
#container-foot { width:100%; margin: 0px;}
#content { width:100%; margin-bottom:2%; }
#navigation { width:100%; margin-left:0px; margin-bottom:2%; height: 50px; overflow: hidden;}
ul.navititel li.navititel { display: block; list-style-type: none; margin: 0px; width: 100%; height: 50px; overflow: hidden; }
ul.navititel li.navititel a {display: block;  padding: 10px 10px; margin: 0px 2px 10px 2px; background-color:#CCC; border:1px solid #000;}
ul.navititel li.navititel a:hover { background-color:#7A0000; border:1px solid #000; }

div.handy {position: absolute; width: 100%; z-index: 1; border: 1px solid #000; background:url('images/bg-navi.jpg') repeat;}
} 


@media only screen and (max-width: 480px) {
body {background:url('images/bg-body.jpg') no-repeat;background-color:#E5E5E5;}
#header {width:100%;margin-bottom: 1%;height: 200px;text-align: right;}
#container { width:100%; margin: 0px;}
#container-foot { width:100%; margin: 0px;}
#content { width:100%; margin-bottom:2%; }
#navigation { width:100%; margin-left:0px; margin-bottom:2%; height: 50px; overflow: hidden;}

ul.navititel li.navititel { display: block; list-style-type: none; margin: 0px; width: 100%; height: 50px; overflow: hidden; }
ul.navititel li.navititel a {display: block;  padding: 10px 10px; margin: 0px 2px 10px 2px; background-color:#CCC; border:1px solid #000;}
ul.navititel li.navititel a:hover { background-color:#7A0000; border:1px solid #000; }

div.handy {position: absolute; width: 100%; z-index: 1; border: 1px solid #000; background:url('images/bg-navi.jpg') repeat;}

}