html { margin: 0 auto; padding: 0; }

body { margin: 0 auto; padding-top: 20px;  background: #F3F2E9;}

  .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    }

#container {	margin: 0 auto; padding: 1px; width: 816px; border: 1px solid #003300;}
#container_inner {background: #E0DFE1; } 

#header { text-align: left; background: url(images/O622_inner.jpg); background-size:100%; }
	#header a { text-decoration:none; margin: 0; padding: 60px 0 0 10px; font-family: 'Open Sans', verdana, geneva, sans-serif;  font-weight: normal; font-size: 24px; color: #252D25; }

#sidebar {float:left; text-align: center; background: #E0DFE1; }
	#sidebar a  { font-family: 'Open Sans', verdana, geneva, sans-serif;  text-decoration: none; font-weight: normal; font-size: 14px; color: #006666;}
	#sidebar a:hover {color: #669999;}
	#sidebar p {color:#000; font-family:verdana, geneva, sans-serif;}
	#sidebar h2  { font-family: 'Open Sans', verdana, geneva, sans-serif;  font-weight: bold; color: #263425;	  }
	#sidebar img {max-width:150px; height:auto;}

 #content { float:left; background: #FFffff; }
	#content p   {  font-family:  verdana, geneva, sans-serif; color: #252D25;}
	#content ul { padding: 0; margin: 0; }
	#content li  { font-family: verdana, geneva, sans-serif;  color: #252D25; }
	#content h1 { font-family: 'Open Sans', verdana, geneva, sans-serif;  font-weight: normal; color: #263425;}
	#content h2 { font-family: 'Open Sans', verdana, geneva, sans-serif;  font-weight: normal;  color: #263425;	  }
	#content h3 { font-family: 'Open Sans', verdana, geneva, sans-serif; ; font-weight: normal;  color: #263425; }
	#content a  {font-family:  verdana, Arial, sans-serif; text-decoration: none; font-weight: bold; color: #263425; }
	#content a:hover {  color: #006400;  }
	img.buttonspace {padding:0 10px;}

	#footer {margin: 0 auto;}
	#footer p { text-align: center; font-family:  verdana, Arial, sans-serif; text-decoration: none; color: #92A297; }
	#footer a  {font-family:  verdana, Arial, sans-serif; text-decoration: none;  color: #92A297; }
	#footer a:hover { color: #92A297;}
	
@media screen and (min-width: 0px) 
 {

.topmenu {background: #6F7D6F;   border: 1px solid #555D55; text-align:center;
    color: #fff; font-family: verdana,arial,sans-serif; font-size: 20px; font-weight: 400;
    margin-bottom: 10px; padding: 1px 10px; position: relative; top: 90px; left:65px;width: 60px;}

 	#menu #main {display:none;}
		.trigger ul {display:none;}
		img.menu {margin-left: 20px; border:0; }
	#menu #main ul {list-style-type: none; text-align: left; padding-top:70px;}
	#menu #main ul li {line-height:1.8}
	#menu #main li.menulabel, a.menulabel, .menulabel {font-family: arial, helvetica, sans-serif; text-decoration: none; 
			font-weight: bold; font-size: 16px; line-height:1.6; color: #555D55; 
			position:relative; top:15px; padding:0;} 
				/*this controls font style of main links*/

#container {width: 236px; }
#container_inner {width: 232px; border: 2px solid #fff; }

#header {width: 232px; height: 51px; margin: 0; padding:0; text-align:center; }
	#header a { margin: 0;  color:#555D55; text-align:center; position:relative; top:70px;} 

#sidebar {width: 232px; padding: 60px 0 0 0;}
#sidebar a, #sidebar p  { font-size: 15px;}
#sidebar img {padding-top:40px;}
#sidebar h2 {margin-top: -10px; font-size:16px;}
.hide {display:inline;}
#sidebar p  { font-size: 15px; }
#content {width:222px; padding: 5px;}
	#content p, li {  font-size: 15px; }
	#content li {line-height:1.8; padding-left:5px; margin-left:15px;}
	#content a  {font-size: 15px;  }
	#content h1 {font-size:18px;}
	#content h2, #content h3 {font-size:15px;}
#footer {width:230px;}
	#footer p { font-size: 12px; }
	#footer a  { font-size: 12px; }


}

@media screen and (min-width: 320px) 
 {
#container {	width: 316px;}
#container_inner {width: 312px; } 

#header {width: 312px; height:65px; border-bottom: 2px solid #CED6C6;}
#header h1 {padding-top:60px;}
#menu {padding-top:40px;}
#menu #main ul {padding-top:10px;}

#sidebar {width: 312px; padding-top:40px; }
#content {width: 300px; }
#content p   {padding: 0 5px 0 25px; font-size: 15px;}
img.wrap-right{display:block;margin-left:auto;margin-right:auto;border:0;}
img.wrap-left{display:block;margin-left:auto;margin-right:auto;border:0;}
img.center{display:block;margin-left:auto;margin-right:auto;border:0;}
#footer  {width: 310px; }
	#footer p { padding: 0; font-size: 12px; }
	#footer a  {text-decoration: none; font-size: 12px;  }

.topmenu {position: relative; top: 40px; left:100px;}


}


@media screen and (min-width: 480px) 
 {

.topmenu {position: relative; top: 10px; left:177px;}


#container {width: 476px; }
#container_inner {width:462px; padding:5px;}
#header {width: 462px; height:101px;}
#header a {position:relative; top:110px;}
#menu {padding-top:50px;}
#menu #main ul {padding-top:10px;}
#sidebar {width: 442px; padding: 10px 10px 30px 10px;}
#sidebar a  { font-size: 15px;}
.hide {display:inline;}
#sidebar p  { font-size: 15px; }
#content {width:450px; padding: 5px; }
#content p, li {  font-size: 15px; }
#content li {line-height:1.8; padding-left:10px; margin-left:10px;}
#content a  {font-size: 15px;  }
#footer p { font-size: 12px; }
#footer {width:470px;}
#footer a  { font-size: 12px; }


}


@media screen and (min-width: 600px) 
 {


.topmenu {display:none;}
#menu { width: 582px;  height: 30px; vertical-align: middle; background: #948C8C; padding: 0; float: left;}

#menu #main {display: block; margin: 0;  width:582px; }

#menu #main ul {	list-style: none;	position: relative;	/*display: inline-table;*/	width: 100%; margin:0;	text-align:center; position:relative; top:-25px; left: -38px;}
	#menu #main ul:after {		content: ""; clear: both; display: block;	}
	#menu #main ul li {text-align:center; float:left; padding:0;}

#menu #main .menulabel {font-family:verdana, helvetica, sans-serif; text-decoration:none;
	color: #FFF; font-size: 12px; font-weight:bold; text-align: center; padding:0 9px; line-height:1.3; text-align:center;} 
	#menu a.menulabel:hover {color: #D7DDD9; }

#menu .hide, #menu a.hide {display:none;}
#menu .hidebr {display:none;}

#menu #main a.hide600larger, #menu #main .hide600larger {display:none;}


#menu #main ul li:hover {	} 
			/* this controls the main menu hover */

#container {width: 596px; }
#container_inner {width:582px; background: #E0DFE1;}
#header {width: 582px; height:128px; text-align:left;}
#header a {text-align:left; padding-left:5px; position:relative; top:100px;}
#sidebar {width: 160px; padding: 20px 5px 30px 5px; }
#sidebar a  { font-size: 13px; font-weight:bold; line-height:1.8;}
#sidebar a.display600only {display:block; font-weight:bold;}

.hide {display:inline;}
#sidebar p  { font-size: 12px; }

 #content {width:400px; padding: 5px;  }
	#content p, li {  font-size: 12px; padding-left:20px;}
	#content li {line-height:1.6; padding-left:20px; margin-left:30px;}
	#content a  {font-size: 12px;  }
#content h2 {padding-left:20px;}

#footer {width:590px;}
	#footer p { font-size: 10px; }
	#footer a  { font-size: 10px; }

}

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

#menu { width: 736px;  }
#menu #main {width:736px; }
#menu #main ul {padding:0; position:relative; top:-11px; left:0;}
#menu #main ul li {line-height:1.3;}

#menu #main a.hide600larger, #menu #main .hide600larger {display:inline;}
#menu #main a.hide768lg, #menu #main .hide768lg {display:none;}

#menu #main ul li {text-align:center; float:left; padding:0;}
#menu #main .menulabel {padding:3px 2px;} 

#container {width: 762px; }
#container_inner {width: 736px; border: 8px solid #fff; }
#header {width: 736px; height:162px}
#header a {position:relative; top:130px;}
#sidebar {width: 174px; padding: 20px 10px 30px 10px;}
#sidebar a  { font-size: 14px;}

img.wrap-right{float:right; margin-left:10px; margin-right:10px;}
img.wrap-left{float:left; margin-left:10px; margin-right:10px;}


.hide {display:inline;}
#sidebar p  { font-size: 12px; }

#content {width: 520px; padding: 10px; }
#content p, li { margin-left: 20px; }
#content li {line-height:1.4; padding-left:10px; margin-left:60px;}
#content h2 {padding-left:20px; font-weight:600;}
#content h3 {padding-left:30px;}
}

@media screen and (min-width: 800px) 
 {

#menu { width: 750px; }
#menu #main {width:750px; }
#menu #main ul {padding:0; }
#menu .hide, #menu a.hide {display:inline;}
#menu #main ul li {text-align:center; float:left; padding:0; }
#menu #main .menulabel {padding:0 2px;} 


#container {width: 776px; }
#container_inner {width: 750px; border: 8px solid #fff; background: #E0DFE1;}
#header {width: 750px; height:165px}
#sidebar {width: 174px; padding: 20px 10px 30px 10px;}
#sidebar a  { font-size: 14px;}
.hide {display:inline;}
#sidebar p  { font-size: 12px; }
#content {width: 532px; padding: 10px; }
#content p, li { margin-left: 20px; }
#content li {line-height:1.4; padding-left:10px; margin-left:60px;}

}