@charset "utf-8";
/* CSS Document */
@font-face { font-family: Tahoma; src: url(tahoma_2.ttf); }
@font-face { font-family: Tahoma; font-weight: bold; src: url(tahomabd_2.ttf); }

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, 
p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figure, figcaption, hgroup, 
menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-family: Tahoma;
	text-decoration:none;
}
a:link, a:visited{ color:#333333;}

body { 
padding: 0; 
margin: 0 auto; 
text-align:center;
width: 100&;
height: 100%;
background-color: #333333;
}

h1 { font-size:20px; color: #333333; text-align:left;  padding-bottom: 5px;}
h2 { font-size:14px; color: #333333; text-align:left;}
h3 { font-size:12px; color: #666666; text-align:left;}
h6 { font-size:10px; color: #666666; text-align:center;}
p {font-size:14px; color: #666666; text-align: left;}


#Container {width: 1024px; height: auto; margin: 0 auto; background-image:url(images/bg_01.jpg); background-repeat: no-repeat; background-color: #bfbfbf;}
#Footer { width: 100%; height: 20px; float: left; font-size:14px; color: #FFFFFF; background-color: #000000; padding-top: 5px;}
#Header {width: 100%; height: 120px; float: left; }

#Menu { width: 800px; height: auto; float: left; margin-left: 200px;}

#Menu ul { margin-top: 15px; padding-left: 0px;}
#Menu li { width: auto; height: 80px; padding: 0px 20px 0px 20px;font-size:14px;  list-style:none; float: left; font-family: Tahoma; color: #FFFFFF;   padding-top: 25px;}

#Content {width: auto; height: auto; float: right; margin-left: 50px; margin-right: 50px;}
#Content-right { width: 720px; height: auto; float: right; text-align:right; }
#Content-gallery { width: 700px; height: auto; float: right; text-align:right; }


.gallery { width: auto; text-align:left; padding:5px;}
div.gallery-row:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
div.gallery-item { float: left; width: 100px; margin:2px;}
div.gallery-item a { display: block; margin: 0px; border: 1px solid #3c3c3c; }
div.gallery-item img { display: block; width: 100%; height: auto; }


@media only screen and (max-width: 768px) {
#Container {width: 100%; height: auto; margin: 0 auto; background-image:url(images/bg_01.jpg); background-repeat: no-repeat; background-color: #bfbfbf;}
#Footer { width: 100%; height: 20px; float: left; font-size:14px; color: #FFFFFF; background-color: #000000; padding-top: 5px;}
#Header {width: 100%; height: 120px; float: left; }

#Menu { width: 800px; height: auto; float: left; margin-left: 200px;}

#Menu ul { margin-top: 15px; padding-left: 0px;}
#Menu li { width: auto; height: 80px; padding: 0px 10px 0px 10px;font-size:14px; list-style:none; float: left; font-family: Tahoma; color: #FFFFFF;   padding-top: 25px;}

#Content {width: auto; height: auto; float: right; margin-left: 50px; margin-right: 50px;}
#Content-right { width: 470px; height: auto; float: right; text-align:right; }
#Content-gallery { width: 470px; height: auto; float: right; text-align:right; }
}


@media only screen and (max-width: 480px) {
h1 { font-size:16px; color: #333333; text-align:left;  padding-bottom: 5px;}
h2 { font-size:14px; color: #333333; text-align:left;}
h3 { font-size:12px; color: #666666; text-align:left;}
h6 { font-size:10px; color: #666666; text-align:center;}
p {font-size:12px; color: #666666; text-align: left;}


#Container {width: 100%; height: auto; margin: 0 auto; background-image:url(images/bg_02.jpg); background-repeat: no-repeat; background-color: #bfbfbf;}
#Footer { width: 100%; height: 20px; float: left; font-size:12px; font-weight:bold; color: #FFFFFF; background-color: #000000; padding-top: 5px;}
#Header {width: 100%; height: 50px; float: left; }

#Menu { width: 80%; height: auto; float: left; margin-left: 17%;}

#Menu ul { margin-top: 5px; padding-left: 0px;}
#Menu li { width: auto; height: 20px; padding: 0px 25px 0px 25px;font-size:12px; list-style:none; float: left; font-family: Tahoma; color: #FFFFFF;   padding-top: 5px;}

#Content {width: auto; height: auto; float: right; margin-left: 10px; margin-right: 20px;}
#Content-right { width: 350px; height: auto; float: right; text-align:right; }
#Content-gallery { width: 350px; height: auto; float: right; text-align:right; }

.gallery { width: auto; text-align:left; padding:5px;}
div.gallery-row:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
div.gallery-item { float: left; width: 80px; margin:2px;}
div.gallery-item a { display: block; margin: 0px; border: 1px solid #3c3c3c; }
div.gallery-item img { display: block; width: 100%; height: auto; }
}

@media only screen and (max-width: 320px) {
#Container {width: 100%; height: auto; margin: 0 auto; background-image:url(images/bg_02.jpg); background-repeat: no-repeat; background-color: #bfbfbf; ; }
#Footer { width: 100%; height: 20px; float: left; font-size:14px; color: #FFFFFF; background-color: #000000; padding-top: 5px;}
#Header {width: 100%; height: 20px; float: left; }

#Menu { width: 70%; height: auto; float: left; margin-left: 30%;}

#Menu ul { margin-top: 5px; padding-left: 0px;}
#Menu li { width: auto; height: 20px; padding: 0px 5px 0px 5px;font-size:12px; list-style:none; float: left; font-family: Tahoma; color: #FFFFFF;   padding-top: 5px;}

#Content {width: auto; height: auto; float: right; margin-left: 10px; margin-right: 10px; margin-top: 30px;}
#Content-right { width: 190px; height: auto; float: right; text-align:right; }
#Content-gallery { width: 190px; height: auto; float: right; text-align:right; }
}

