@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/************************************************************************************
MOBILE LAYOUT: 480px and below.
*************************************************************************************/
.gridContainer {margin: 0 auto; width: 100%; padding: 0; padding-right: 0; background-color: #fff; font-size: 80%;}

/*  header styles  */
header {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
#mastojplogo {padding: 0 0 0 35px; min-height: 48px; background-image:url(../images/1_ojp_mast_02_cell.gif); background-position:bottom;}
#masthead {position: relative; clear: both; float: left; padding: 1.5% 1.5% 0 1.5%; width: 96%; margin-right: 1%; display: block; background-image:none; background-repeat:no-repeat; background-position:bottom right;}
#masthead_rgt {position: absolute; clear: none; top: 0; right: 5%; margin-left: 0; width: 95%; display: block;}
.masthead_nav {margin: 0; display: none;}
#search {margin: 0 1% 0 0; padding: 1px 0 0 0; height: 21px; float: left; width: 92%; text-align:right;}	
#srch_box {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; font-size: 90%; width: 50%;}
#srch_box2 {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; font-size: 90%; width: 50%;}
#srch_bttn {margin: 0; padding: 0px; float: left;  width: 7%;}

#tagline {clear: both;float: left;margin: 0;width: 100%; text-align: center; display: block;}
#nibrsheader {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
.imgnibrs {clear: both; margin: 0; padding: 0; border: none; display: block;}
.imgnibrs_lrg {clear: both; margin: 0; padding: 0; border: none; display: none;}
/*  header end     */

/* navigation styles  */
#nav {position: relative; top: 0; left: auto; z-index: 9999999999;}
#nav > a {display: none;}#nav > a {width: 27px; /* 50 */ height: 25px; /* 50 */ text-align: left; text-indent: -9999px; background-color: #3E6351; position: relative; top:7px; left: 5px; border-radius: 5px;}
#nav > a:before, #nav > a:after {position: absolute; border: 2px solid #fff; top: 25%; left: 25%; right: 25%; 
content: '';}
#nav > a:after {top: 60%;}
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {display: block;}
/* first level */
#nav > ul {height: auto; display: none; position: absolute; margin-top: 5px; left: 5px; right: 15px;}
#nav:target > ul {display: block;}
#nav > ul > li.home {width: 95%; float: none; background-color: #3E6351; border-bottom: 1px solid #fff; padding: 5px;}
#nav > ul > li.mfd {width: 95%; float: none; background-color: #3E6351; border-bottom: 1px solid #fff; padding: 5px;}
#nav > ul > li.eight {width: 95%; float: none; background-color: #fff; border-bottom: 3px solid #3E6351; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.eighthp {width: 95%; float: none; background-color: #fff; border-bottom: 3px solid #3E6351; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.home > a {display:block; line-height: 15px; width: 100%; text-align: left; color: #fff; font-size:100%; text-decoration:none;}
#nav > ul > li.mfd > a {display:block; line-height: 15px; width: 100%; text-align: left; color: #fff; font-size:100%; text-decoration:none;}
#nav > ul > li.eight > a {padding: 10px 0px; line-height: 15px; color: #3E6351; font-size:100%; font-weight: bold; text-decoration:none;}
#nav > ul > li.eighthp > a {padding: 10px 0px; line-height: 15px; color: #3E6351; font-size:100%; font-weight: bold; text-decoration:none;}
#nav > ul > li:not( :last-child ) > a {border-right: none;}
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {background-color: none;}
/* second level */
#nav li ul {background-color: #fff; display: none; position: absolute; top: 100%; width: 98.25%;}
#nav li.eight ul {background-color: #fff; display: none; position: absolute; top: 100%; width: 98.25%}
#nav li:hover ul {display: block; left: 0; right: 0;}
#nav li:not( :first-child ):hover ul {left: 0px;}
#nav li ul li {padding: 5px; border-bottom: 1px solid #3E6351;}
#nav li ul a {font-size:90%; text-decoration:none; color: #3E6351;}
#nav li ul li:hover, #nav li ul:not( :hover ) li.active a {background-color: #3E6351;}
#nav li ul li:hover a {color: #fff; text-decoration: none;}


#navright {float: none; margin: 0 0 10px 0; padding-right: 4.5%; width: 95.5%; display: block; text-align: right; color: #3E6351; font-weight: bold;}
#emailfriend {float: left; margin: 7px 0 0 0; width: 49%; display: none; color: #000; font-size: 80%; font-weight: normal; text-align: right;}
#m-linkshp {float: left; margin: 7px 0 0 0; width: 51%; display: none; color: #3E6351; font-size: 80%; font-weight: bold; text-decoration: none; text-align:right;}

/* navigation end     */


#pagecontent {float: left; margin: 0 2% 0 0; width: 98%; display: block;}
#pfv {display: none;}
#socialmedia {clear: both; float: left; margin: -5px 3% 0 3%; width: 90%; display: block; border: 1px solid #3E6351; border-radius: 6px; text-align: center; padding: 2%;}
.image_socmed {padding: 0px; margin: 0 5px; border: none;} 
#maincontent {clear: both; float: left; margin: 0 3%; width: 96%; display: block;}
#maincontenthp {clear: both; float: left; margin: 0 3%; width: 96%; display: block;}
#mainimage {z-index: 99; position: relative; clear: both; float: left; margin: 5px 0 0 0; width: 97.75%; display: block; border: 1px solid #3E6351; border-radius: 6px;}
#mainimage_dd {position: absolute; top: 62%; left: 2%; margin: 0; padding: 0;}
#mainimage_dd > ul {height: auto; display: inline-block; margin: 0; padding: 0; list-style-type:none}
#mainimage_dd:target > ul {display: block;}
#mainimage_dd > ul > li {width: 200px; float: none; background-color: #fff; border: 1px solid #3E6351; padding: 4px 0; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 98% 0; border-radius: 5px; color: #3E6351; font-size:70%;}
#mainimage_dd > ul > li > a {display:block; width: 100%; text-align: left; color: #3E6351; font-size:70%; text-decoration:none;}
#mainimage_dd li ul {display: none; position: relative; top: 100%; width: 100%; margin: 5px 0 0 0; padding: 0; list-style-type:none}
#mainimage_dd li:hover ul {display: block; left: 0;}
#mainimage_dd li:not( :first-child ):hover ul {left: 0;}
#mainimage_dd li ul li {padding: 3px; border-top: 1px solid #3E6351;}
#mainimage_dd li ul a {font-size:80%; text-decoration:none; color: #3E6351;}
#mainimage_dd li ul li:hover, #mainimage_dd li ul:not( :hover ) li.active a { background-color:#3E6351; color: #fff; text-decoration: none;}
#mainimage_dd li ul li:hover a {color: #fff; text-decoration: none;}
#column1 {clear: both; float: left; margin: 0; padding: 0; width: 100%; display: block;}
#column2 {clear: both; float: left; margin: 0; padding: 0; width: 100%; display: block;}
#column3 {clear: both; float: left; margin: 0; padding: 0; width: 100%; display: block;}
#column2hp {clear: both; float: left; margin: 0; padding: 0; width: 100%; display: block;}
aside {clear: both; float: left; margin: 10px 0 0 0; padding: 0; width: 100%; display: block; text-align:center;}
#textbox {clear: both; float: left; margin: 10px 0 0 0; width: 93%; display: block; background-color: #21362B; border: 1px solid #3E6351; border-radius: 5px; padding: 3%; color: #1d3800; font-weight: bold;}
#textbox_hp {clear: both; float: left; margin: 10px 0 0 0; width: 93%; display: block; background-color: #21362B; border: 1px solid #3E6351; border-radius: 5px; padding: 3%; color: #cccc9a; font-weight: bold;}
table.second {border: 1px solid #000; font-size: 80%;}
table.second caption {display: table-caption; text-align: left; font-size: 135%; color: #1d3800; font-weight: bold;} 
table.third {border: 1px solid #000; font-size: 75%;}
table.third caption {display: table-caption; text-align: left; font-size: 140%; color: #1d3800; font-weight: bold;} 
table.fourth {border: 1px solid #000; font-size: 70%;}
table.fourth caption {display: table-caption; text-align: left; font-size: 145%; color: #1d3800; font-weight: bold;} 

.go-top {position: fixed; bottom: 0; right: 0; text-decoration: none; color: #fff; background-color: rgba(0, 0, 0, 0.2); 	font-size: 12px; padding: 1em 3em; display: none;}
.go-top:visited {color: #fff;}

@media only screen and (min-width: 481px) {
.imgnibrs {clear: both; margin: 0; padding: 0; border: none; display: none;}
.imgnibrs_lrg {clear: both; margin: 0; padding: 0; border: none; display: block;}

}


/************************************************************************************
TABLET LAYOUT: 641px to 768px. Inherits styles from: Mobile Layout.
*************************************************************************************/
@media only screen and (min-width: 641px) {
.gridContainer {width: 100%; padding-left: 0; padding-right: 0; font-size: 100%;}

/*  header styles  */
#header {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
#mastojplogo {padding: 0; min-height: 48px; background-image:url(../images/1_ojp_mast_02_cell.gif); background-position:bottom;}
#masthead {clear: both; float: left; padding: 0 1%; width: 97%; margin-left: 0; display: block; background-image:url(../images/1_ovc_mast_02_768.gif); background-repeat:no-repeat; background-position:bottom right;}
#masthead_rgt {clear: none; margin-left: 0; right: 2%; display: block; text-align:right;}
.masthead_nav {margin: 0; display: none;}
#search {margin: 0 1% 0 0; padding: 1px 0 0 0; height: 21px; float: left; width: 94%; text-align:right;}	
#srch_box {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; font-size: 90%; width: 30%;}
#srch_box2 {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; font-size: 90%; width: 30%;}
#srch_bttn {margin: 0; padding: 0px; float: left; width: 5%;}
#tagline {display: none;}
#nibrsheader {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
.imgnibrs {clear: both; margin: 0; padding: 0; border: none; display: none;}
.imgnibrs_lrg {clear: both; margin: 0; padding: 0; border: none; display: block;}
/* header end      */

/* navigation styles  */
#topnavigation {position: relative; clear: both; float: left; margin: -20px 0 0 0; width: 100%; display: block;}
#nav {position: relative; float: left; width: 60%; top: 0; left: 2.5%; z-index: 9999999999;}
#nav > a {display: none;}
#nav > a {display: none!important; width: 27px; /* 50 */ height: 25px; /* 50 */ text-align: left; text-indent: -9999px; background-color: #3E6351; position: relative; top:0; left: 5px; border-radius: 5px;}
#nav > a:before, #nav > a:after {display: none; position: absolute; border: 2px solid #fff; top: 25%; left: 25%; right: 25%; content: '';}
#nav > a:after {display: none; top: 60%;}
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {display: none; display: block;}
#nav li {position: relative;}
#nav li a {color: #fff; display: block;}
#nav li a:active {background-color: #06C !important;}
#nav span:after {width: 0; height: 0; border: 0.313em solid transparent; /* 5 */ border-bottom: none; 			border-top-color: #none; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -0.313em; /* 5 */}
/* first level */
#nav > ul {height: inherit; display: inline; position: absolute; margin-top: 0; left: 0; right: 0;}
#nav > ul > li {height: 100%; float: left;}
#nav > ul > li.home {display: none; width: 25%; height: 100%; float: left;}
#nav > ul > li.mfd {width: 40%; height: 100%; float: left; background-color: #3E6351; padding: 6px 5px 6px 35px; background-image: url(../images/1_rgt_arrow.png); background-repeat:no-repeat; background-position: 2% 50%; border-radius: 5px; margin-right: 1%;}
#nav > ul > li.eight {width: 43%; height: 100%; float: left; background-color: #fff; border: 1px solid #3E6351; border-radius: 5px; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.eighthp {display: none; width: 43%; height: 100%; float: left; background-color: #fff; border: 1px solid #3E6351; border-radius: 5px; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.mfd > a {height: 100%; line-height: 15px; width: 100%; text-align: left; color: #fff; font-size:95%; text-decoration:none; font-weight: bold;}
#nav > ul > li.eight > a {height: 100%; line-height: 15px; padding: 0; width: 100%; text-align: left; color: #3E6351; font-size:95%; font-weight: bold; text-decoration:none;}
#nav > ul > li:not( :last-child ) > a {border-right: none;}
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {background-color: none;}
/* second level */
#nav li ul {background-color: #fff; display: none; position: absolute; top: 100%; margin-top: -2px; border-bottom: 1px solid #3E6351; border-left: 1px solid #3E6351; border-right: 1px solid #3E6351; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px}
#nav li.eight ul {background-color: #fff; display: none; position: absolute; top: 100%; width: 100.02%}
#nav li:hover ul {display: block; left: 0; right: 0;}
#nav li:not( :first-child ):hover ul {left: -1px;}
#nav li ul li {padding: 5px; border-top: 1px solid #3E6351;}
#nav li ul a {font-size:85%; text-decoration:none; color: #3E6351;}
#nav li ul li:hover, #nav li ul:not( :hover ) li.active a {background-color: #3E6351;}
#nav li ul li:hover a {color: #fff; text-decoration: none;}
#navright {float: right; margin: 0; padding-right: 2.5%; width: 34.5%; display: block; text-align: right; color: #3E6351; font-weight: bold;}
#emailfriend {float: left; margin: 7px 0 0 0; width: 49%; display: block; color: #000; font-size: 80%; font-weight: normal; text-align: right;}
#m-linkshp {float: left; margin: 7px 0 0 0; width: 51%; display: block; color: #3E6351; font-size: 80%; font-weight: bold; text-decoration: none; text-align:right;}
#emailfriend a, #emailfriend a:link, #emailfriend a:visited {color: #3E6351; text-decoration: none; font-weight: bold;}
/* navigation end     */

#pagecontent {float: left!important; margin: 0; width: 100%; display: block;}
#pfv {clear: both; float: right; margin: 10px 0 0 0; padding: 0; width: 22%; display: block;}
#pfv a, #pfv a:link, #pfv a:visited {font-size: 70%; color: #575757; text-decoration: none;}
#socialmedia {clear: both; float: right; margin: 10px 2.5% 0 0; width: 18%; display: block; border: 1px solid #3E6351; border-radius: 6px; text-align: center; padding: 1%;}
.image_socmed {padding: 0px; margin: 0 5px; border: none;}
#maincontent {clear: none; float: left; margin: -12px 0 20px 2.5%; width: 73%; display: block;}
#maincontenthp {clear: none; float: left; margin: -12px 0 20px 2.5%; padding: 0; width: 73%; display: block;}
#mainimage {z-index: 99; position: relative; clear: both; float: left; margin: 0; width: 100%; display: block; border: none; border-radius: 6px;}
#mainimage_dd {position: absolute; top: 72%; left: 2%; margin: 0; padding: 0;}
#mainimage_dd > ul {height: auto; display: inline-block; margin: 0; padding: 0; list-style-type:none}
#mainimage_dd:target > ul {display: block;}
#mainimage_dd > ul > li {width: 300px; float: none; background-color: #fff; border: 1px solid #3E6351; padding: 4px 0; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 98% 2px; border-radius: 5px; color: #3E6351; font-size:12px; font-weight: bold;}
#mainimage_dd > ul > li > a {display:block; width: 100%; text-align: left; color: #3E6351; font-size:12px; text-decoration:none;}
#mainimage_dd li ul {display: none; position: relative; top: 100%; width: 100%; margin: 5px 0 0 0; padding: 0; list-style-type:none}
#mainimage_dd li:hover ul {display: block; left: 0;}
#mainimage_dd li:not( :first-child ):hover ul {left: 0;}
#mainimage_dd li ul li {padding: 3px; border-top: 1px solid #3E6351;}
#mainimage_dd li ul a {font-size:11px; text-decoration:none; color: #3E6351;}
#mainimage_dd li ul li:hover, #mainimage_dd li ul:not( :hover ) li.active a { background-color:#3E6351; color: #fff; text-decoration: none;}
#mainimage_dd li ul li:hover a {color: #fff; text-decoration: none;}
#column1 {clear: both; float: left; margin: 0 2.5% 0 0; padding: 0; width: 64.5%; display: block;}
#column2 {clear: none; float: left; margin: 0; padding: 22px 0 0 0; width: 33%; display: block;}
#column2hp {clear: none; float: left; margin: 0 2.5% 0 0; padding: 5px 0 0 0; width: 30.5%; display: block;}
#column3 {clear: both; float: left; margin: 0 2.5% 0 0; padding: 0; width: 97.5%; display: block;}
aside {clear: none; float: right; margin: 10px 0 0 0; padding: 0 2.5% 0 0; width: 21%; display: block; text-align:right;}
#textbox {clear: both; float: left; margin: 10px 0 0 0; width: 94%; display: block; background-color: #21362B; border: 1px solid #3E6351; border-radius: 5px; padding: 3%; color: #1d3800; font-weight: bold;}
#textbox_hp {clear: both; float: left; margin: 10px 0 0 0; width: 94%; display: block; background-color: #21362B; border: 1px solid #3E6351; border-radius: 5px; padding: 3%; color: #cccc9a; font-weight: bold;}
table.second {border: 1px solid #000; font-size: 70%;}
table.second caption {display: table-caption; text-align: left; font-size: 145%; color: #1d3800; font-weight: bold;} 
table.third {border: 1px solid #000; font-size: 60%;}
table.third caption {display: table-caption; text-align: left; font-size: 155%; color: #1d3800; font-weight: bold;} 
table.fourth {border: 1px solid #000; font-size: 60%;}
table.fourth caption {display: table-caption; text-align: left; font-size: 155%; color: #1d3800; font-weight: bold;} 

}


/************************************************************************************
DESKTOP LAYOUT: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout.
*************************************************************************************/
@media only screen and (min-width: 769px) {
.gridContainer {width: 100%; max-width: 960px; min-width: 960px; padding-left: 0; padding-right: 0; margin: 0px auto; font-size: 100%; background-color: #fff;}

/*  header styles  */
header {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
#masthead {position: relative; clear: both; float: left; padding: 0 1%; width: 98%; margin-left: 0; display: block; background-image:url(../images/1_ovc_mast_02.gif); background-repeat:no-repeat; background-position:bottom right;}
#masthead_rgt {position: absolute; top: 0; right: 0; clear: none; margin-left: 0;	display: block;}
.masthead_nav {margin: 0; display: block; float: left; width: 68.5%;}
#search {margin: 0 0 0 1.5%; padding: 1px 0 0 0; height: 21px; float: left; width: 23.5%; }	
#srch_box {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; width: 100%; font-size: 90%;}
#srch_box2 {margin: 0px; padding: 0px; float: left; height: 19px; color: #999999; border: 1px solid #e5e5e5; width: 75%; font-size: 90%;}
#srch_bttn {margin: 0 1.5% 0 0; padding: 0px; float: left; width: 5%;}
#tagline {display: none;}
#nibrsheader {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
.imgnibrs {clear: both; margin: 0; padding: 0; border: none; display: none;}
.imgnibrs_lrg {clear: both; margin: 0; padding: 0; border: none; display: block;}
/* header end      */

/* navigation styles  */
#topnavigation {position: relative; clear: both; float: left; margin: -15px 0 0 0; width: 100%; display: block;}
#nav {position: relative; float: left; width: 60%; top: 0; left: 2.5%; z-index: 9999999999;}
#nav > a {display: none;}
#nav > a {display: none!important; width: 27px; /* 50 */ height: 25px; /* 50 */ text-align: left; text-indent: -9999px; background-color: #3E6351; position: relative; top:0; left: 5px; border-radius: 5px;}
#nav > a:before, #nav > a:after {display: none; position: absolute; border: 2px solid #fff; top: 25%; left: 25%; right: 25%; content: '';}
#nav > a:after {display: none; top: 60%;}
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {display: none; display: block;}
#nav li {position: relative;}
#nav li a {color: #fff; display: block;}
#nav li a:active {background-color: #06C !important;}
#nav span:after {width: 0; height: 0; border: 0.313em solid transparent; /* 5 */ border-bottom: none; 			border-top-color: #none; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -0.313em; /* 5 */}
/* first level */
#nav > ul {height: inherit; display: inline; position: absolute; margin-top: 0; left: 0; right: 0;}
#nav > ul > li {height: 100%; float: left;}
#nav > ul > li.home {display: none; width: 25%; height: 100%; float: left;}
#nav > ul > li.mfd {width: 40%; height: 100%; float: left; background-color: #3E6351; padding: 6px 5px 6px 35px; background-image: url(../images/1_rgt_arrow.png); background-repeat:no-repeat; background-position: 2% 50%; border-radius: 5px; margin-right: 1%;}
#nav > ul > li.eight {width: 43%; height: 100%; float: left; background-color: #fff; border: 1px solid #3E6351; border-radius: 5px; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.eighthp {display: none; width: 43%; height: 100%; float: left; background-color: #fff; border: 1px solid #3E6351; border-radius: 5px; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.mfd > a {height: 100%; line-height: 15px; width: 100%; text-align: left; color: #fff; font-size:95%; text-decoration:none; font-weight: bold;}
#nav > ul > li.eight > a {height: 100%; line-height: 15px; padding: 0; width: 100%; text-align: left; color: #3E6351; font-size:95%; font-weight: bold; text-decoration:none;}
#nav > ul > li:not( :last-child ) > a {border-right: none;}
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {background-color: none;}
/* second level */
#nav li ul {background-color: #fff; display: none; position: absolute; top: 100%; margin-top: -2px; border-bottom: 1px solid #3E6351; border-left: 1px solid #3E6351; border-right: 1px solid #3E6351; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px}
#nav li.eight ul {background-color: #fff; display: none; position: absolute; top: 100%; width: 100.02%}
#nav li:hover ul {display: block; left: 0; right: 0;}
#nav li:not( :first-child ):hover ul {left: -1px;}
#nav li ul li {padding: 5px; border-top: 1px solid #3E6351;}
#nav li ul a {font-size:85%; text-decoration:none; color: #3E6351;}
#nav li ul li:hover {background-color: #3E6351;}
#nav li ul li:hover a {color: #fff; text-decoration: none;}
#navright {float: right; margin: -12px 0 0 0; padding-right: 2.5%; width: 34.5%; display: block; text-align: right; color: #3E6351; font-weight: bold;}
#emailfriend {float: left; margin: 8px 0 0 0; width: 39%; display: block; color: #000; font-size: 80%; font-weight: normal; text-align: right;}
#m-linkshp {float: left; margin: 8px 0 0 0; width: 61%; display: block; color: #3E6351; font-size: 80%; font-weight: bold; text-decoration: none; text-align:right;}
#emailfriend a, #emailfriend a:link, #emailfriend a:visited {color: #3E6351; text-decoration: none; font-weight: bold;}
/* navigation end     */

#pagecontent {float: left!important; margin: 10px 2.5% 0 2.5%; width: 95%; display: block;}
#pfv {clear: none; float: right; margin: 0; width: 18%; display: block; text-align:center;}
#pfv a, #pfv a:link, #pfv a:visited {font-size: 70%; color: #575757; text-decoration: none;}
#socialmedia {clear: both; float: right; margin: 10px 0 0 0; width: 15%; display: block; border: 1px solid #3E6351; border-radius: 6px; text-align: center; padding: 1%;}
.image_socmed {padding: 0px; margin: 0 5px; border: none;} 
#maincontenthp {clear: none; float: left; margin: -7px 0 20px 0; padding: 0; width: 79.5%; display: block;}
#maincontent {clear: none; float: left; margin: -12px 0 20px 0; padding: 0; width: 79.5%; display: block;}
#mainimage {z-index: 99; position: relative; clear: both; float: left; margin: 0; width: 100%; display: block; border: none; border-radius: 6px;}
#mainimage_dd {position: absolute; top: 72%; left: 2%; margin: 0; padding: 0;}
#mainimage_dd > ul {height: auto; display: inline-block; margin: 0; padding: 0; list-style-type:none}
#mainimage_dd:target > ul {display: block;}
#mainimage_dd > ul > li {width: 300px; float: none; background-color: #fff; border: 1px solid #3E6351; padding: 4px 0; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 98% 2px; border-radius: 5px; color: #3E6351; font-size:12px; font-weight: bold;}
#mainimage_dd > ul > li > a {display:block; width: 100%; text-align: left; color: #3E6351; font-size:12px; text-decoration:none;}
#mainimage_dd li ul {display: none; position: relative; top: 0; width: 100%; margin: 5px 0 0 0; padding: 0; list-style-type:none}
#mainimage_dd li:hover ul {display: block; left: 0;}
#mainimage_dd li:not( :first-child ):hover ul {left: 0;}
#mainimage_dd li ul li {padding: 3px; border-top: 1px solid #3E6351;}
#mainimage_dd li ul a {font-size:11px; text-decoration:none; color: #3E6351;}
#mainimage_dd li ul li:hover, li.active a { background-color:#3E6351; color: #fff; text-decoration: none;}
#mainimage_dd li ul li:hover a {color: #fff; text-decoration: none;}
#column1 {clear: both; float: left; margin: 0 2.5% 0 0; padding: 0; width: 64.5%; display: block; z-index:9999999999;}
#column2 {clear: none; float: left; margin: 0 1% 0 0; padding: 22px 0 0 0; width: 32%; display: block; z-index:9999;}
#column2hp {clear: none; float: left; margin: 0 1% 0 0; padding: 5px 0 0 0; width: 32%; display: block;}
#column3 {clear: both; float: left; margin: 0 2.5% 0 0; padding: 0; width: 97.5%; display: block;}
#column1pfv {float: left; margin: 0 2.5% 0 0; padding: 0; width: 92.5%; display: block;}
#column1pfv h1 {margin: 15px 0 0 0; font-size: 150%; color: #1d3800;}	
aside {clear: none; float: right; margin: 10px 0 0 0; padding: 0; width: 18%; display: block; text-align:right;}
#textbox {clear: both; float: left; margin-top: 10px; width: 100%; display: block; background-color: #21362B; border: 1px solid #3E6351; border-radius: 5px; padding: 10px; color: #cccc9a; font-weight: bold;}
#textbox_hp {clear: both; float: left; margin-top: 10px; width: 93%; display: block; background-color: #cccc9a; border: 1px solid #3E6351; border-radius: 5px; padding: 10px; color: #1d3800; font-weight: bold;}
table.second {border: 1px solid #000; font-size: 85%;}
table.second caption {display: table-caption; text-align: left; font-size: 130%; color: #1d3800; font-weight: bold;} 
table.third {border: 1px solid #000; font-size: 80%;}
table.third caption {display: table-caption; text-align: left; font-size: 135%; color: #1d3800; font-weight: bold;} 
table.fourth {border: 1px solid #000; font-size: 70%;}
table.fourth caption {display: table-caption; text-align: left; font-size: 145%; color: #1d3800; font-weight: bold;} 

}

/************************************************************************************
PRINT STYLES
*************************************************************************************/
@media print {
.gridContainer {width: 100%; max-width: 960px; min-width: 960px; padding-left: 0; padding-right: 0; margin: 0px auto; font-size: 100%; background-color: #fff;}
.gridContainer a:link:after, a:visited:after { content:" "; }
/*  header styles  */
header {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
#mastojplogo {padding: 0; margin-bottom: 10px; min-height: 48px; background-image:url(../images/1_ojp_mast_02_cell.gif); background-position:bottom; border-bottom: 3px solid #575757;}
#masthead {position: relative; clear: both; float: left; padding: 0 1%; width: 98%; margin-left: 0; display: block; background-image:url(../images/1_ovc_mast_02.gif); background-repeat:no-repeat; background-position:bottom right;}
#masthead_rgt {position: absolute; top: 0; right: 0; clear: none; margin-left: 0;	display: block;}
.masthead_nav {margin: 0; display: block; float: left; width: 68.5%;}
.masthead_nav a {display: none;}
#search {margin: 0 0 0 1.5%; padding: 1px 0 0 0; height: 21px; float: left; width: 23.5%; }	
#srch_box {margin: 0px; padding: 0px; height: 18px; color: #575757; border: 1px solid #e5e5e5; width: 100%; font-size: 90%;}
#srch_bttn {margin: 0 1.5% 0 0; padding: 0px; float: left; width: 5%;}
#tagline {display: none;}
#nibrsheader {clear: both; float: left; margin-left: 0; width: 100%; display: block;}
.imgnibrs {clear: both; margin: 0; padding: 0; border: none; display: none;}
.imgnibrs_lrg {clear: both; margin: 0; padding: 0; border: none; display: block;}
/* header end      */

/* navigation styles  */
#topnavigation {position: relative; clear: both; float: left; margin: -15px 0 0 0; width: 100%; display: block;}
#nav {position: relative; float: left; width: 60%; top: 0; left: 2.5%; z-index: 9999999999;}
#nav > a {display: none;}
#nav > a {display: none!important; width: 27px; /* 50 */ height: 25px; /* 50 */ text-align: left; text-indent: -9999px; background-color: #3E6351; position: relative; top:0; left: 5px; border-radius: 5px;}
#nav > a:before, #nav > a:after {display: none; position: absolute; border: 2px solid #fff; top: 25%; left: 25%; right: 25%; content: '';}
#nav > a:after {display: none; top: 60%;}
#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type {display: none; display: block;}
#nav li {position: relative;}
#nav li a {color: #fff!important; display: block;}
#nav li a:active {background-color: #06C !important;}
#nav span:after {width: 0; height: 0; border: 0.313em solid transparent; /* 5 */ border-bottom: none; 			border-top-color: #none; content: ''; vertical-align: middle; display: inline-block; position: relative; right: -0.313em; /* 5 */}
/* first level */
#nav > ul {height: inherit; display: inline; position: absolute; margin-top: 0; left: 0; right: 0;}
#nav > ul > li {height: 100%; float: left;}
#nav > ul > li.home {display: none; width: 25%; height: 100%; float: left;}
#nav > ul > li.mfd {width: 40%; height: 100%; float: left; background-color: #3E6351!important; padding: 6px 5px 6px 35px; background-image: url(../images/1_rgt_arrow.png)!important; background-repeat:no-repeat!important; background-position: 2% 50%!important; border-radius: 5px!important; margin-right: 1%;}
#nav > ul > li.eight {width: 43%; height: 100%; float: left; background-color: #fff!important; border: 1px solid #3E6351!important; border-radius: 5px!important; padding: 5px; background-image:url(../images/1_dwn_arrow.png)!important; background-repeat:no-repeat!important; background-position: 96% 50%!important;}
#nav > ul > li.eighthp {display: none; width: 43%; height: 100%; float: left; background-color: #fff; border: 1px solid #3E6351; border-radius: 5px; padding: 5px; background-image:url(../images/1_dwn_arrow.png); background-repeat:no-repeat; background-position: 96% 50%;}
#nav > ul > li.mfd > a {height: 100%; line-height: 15px; width: 100%; text-align: left; color: #fff; font-size:95%; text-decoration:none; font-weight: bold;}
#nav > ul > li.eight > a {height: 100%; line-height: 15px; padding: 0; width: 100%; text-align: left; color: #3E6351!important; font-size:95%; font-weight: bold; text-decoration:none;}
#nav > ul > li:not( :last-child ) > a {border-right: none;}
#nav > ul > li:hover > a, #nav > ul:not( :hover ) > li.active > a {background-color: none;}
/* second level */
#nav li ul {background-color: #fff; display: none; position: absolute; top: 100%; margin-top: -2px; border-bottom: 1px solid #3E6351; border-left: 1px solid #3E6351; border-right: 1px solid #3E6351; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px}
#nav li.eight ul {background-color: #fff; display: none; position: absolute; top: 100%; width: 100.02%}
#nav li:hover ul {display: block; left: 0; right: 0;}
#nav li:not( :first-child ):hover ul {left: -1px;}
#nav li ul li {padding: 5px; border-top: 1px solid #3E6351;}
#nav li ul a {font-size:85%; text-decoration:none; color: #3E6351;}
#nav li ul li:hover, #nav li ul:not( :hover ) li.active a {background-color: #3E6351;}
#nav li ul li:hover a {color: #fff; text-decoration: none;}
#navright {float: right; margin: 0; padding-right: 0%; width: 37%; display: block; text-align: right; color: #3E6351; font-weight: bold;}
#emailfriend {float: left; margin: 8px 0 0 0; width: 39%; display: none; color: #000; font-size: 80%; font-weight: normal; text-align: right;}
#m-linkshp {float: left; margin: 8px 0 0 0; width: 61%; display: none; color: #3E6351; font-size: 80%; font-weight: bold; text-decoration: none; text-align:right;}
#emailfriend a, #emailfriend a:link, #emailfriend a:visited {color: #3E6351; text-decoration: none; font-weight: bold;}
/* navigation end     */

#pagecontent {float: left!important; margin: 10px 2.5% 0 2.5%; width: 95%; display: block;}
#pfv {clear: none; float: right; margin: 0; width: 18%; display: none; text-align:center;}
#pfv a, #pfv a:link, #pfv a:visited {font-size: 70%; color: #575757; text-decoration: none;}
#socialmedia {clear: both; float: right; margin: 10px 0 0 0; width: 15%; display: none; border: 1px solid #3E6351; border-radius: 6px; text-align: center; padding: 1%;}
.image_socmed {padding: 0px; margin: 0 5px; border: none;} 
#maincontenthp {clear: none; float: left; margin: 15px 0 20px 0; padding: 0; width: 97.5%; display: block;}
#maincontent {clear: none; float: left; margin: 0 0 20px 0; padding: 0; width: 97.5%; display: block;}
#mainimage {z-index: 99; position: relative; clear: both; float: left; margin: 0; width: 100%; display: block; border: none; border-radius: 6px;}
#mainimage_dd {position: absolute; top: 72%; left: 2%; margin: 0; padding: 0;}
#mainimage_dd > ul {height: auto; display: inline-block; margin: 0; padding: 0; list-style-type:none}
#mainimage_dd:target > ul {display: block;}
#mainimage_dd > ul > li {width: 300px; float: none; background-color: #fff!important; border: 1px solid #3E6351; padding: 4px 0; background-image:url(../images/1_dwn_arrow.png)!important; background-repeat:no-repeat!important; background-position: 98% 2px!important; border-radius: 5px!important; color: #3E6351!important; font-size:12px; font-weight: bold;}
#mainimage_dd > ul > li > a {display:block; width: 100%; text-align: left; color: #3E6351; font-size:12px; text-decoration:none;}
#mainimage_dd li ul {display: none; position: relative; top: 100%; width: 100%; margin: 5px 0 0 0; padding: 0; list-style-type:none}
#mainimage_dd li:hover ul {display: block; left: 0;}
#mainimage_dd li:not( :first-child ):hover ul {left: 0;}
#mainimage_dd li ul li {padding: 3px; border-top: 1px solid #3E6351;}
#mainimage_dd li ul a {font-size:11px; text-decoration:none; color: #3E6351;}
#mainimage_dd li ul li:hover, #mainimage_dd li ul:not( :hover ) li.active a { background-color:#3E6351; color: #fff; text-decoration: none;}
#mainimage_dd li ul li:hover a {color: #fff; text-decoration: none;}
#column1 {clear: both; float: left; margin: 18px 2.5% 0 0; padding: 0; width: 64.5%; display: block;}
#column2 {clear: none; float: left; margin: 0 1% 0 0; padding: 22px 0 0 0; width: 32%; display: block;}
#column2hp {clear: none; float: left; margin: 0 1% 0 0; padding: 5px 0 0 0; width: 32%; display: block;}
#column3 {clear: none; float: none; margin: 0 2.5% 0 0; padding: 0; width: 97.5%; display: block;}
aside {clear: none; float: right; margin: 10px 0 0 0; padding: 0; width: 18%; display: none; text-align:right;}
#textbox {clear: both; float: left; margin-top: 10px; width: 100%; display: block; background-color: #21362B!important; border: 1px solid #3E6351!important; border-radius: 5px!important; padding: 10px; color: #1d3800!important; font-weight: bold;}
#textbox_hp {clear: both; float: left; margin-top: 10px; width: 98%; display: block; background-color: #21362B!important; border: 1px solid #3E6351!important; border-radius: 5px!important; padding: 1%; color: #cccc9a!important; font-weight: bold;}
table.second {border: 1px solid #000!important; font-size: 85%;}
table.second caption {display: table-caption; text-align: left; font-size: 130%; color: #1d3800; font-weight: bold;} 
table.third {border: 1px solid #000!important; font-size: 80%;}
table.third caption {display: table-caption; text-align: left; font-size: 135%; color: #1d3800; font-weight: bold;} 
table.fourth {border: 1px solid #000!important; font-size: 70%;}
table.fourth caption {display: table-caption; text-align: left; font-size: 145%; color: #1d3800; font-weight: bold;} 
	
#footer {float: left;margin-left: 0;width: 56%;display: none;}
#ojplogo {float: left; margin-left: 2%; width: 14%;display: none;}
#ovclogo {float: left; margin-right: 2%; width: 26%;display: none; text-align: right;}

}