/* CSS Document */

/* Layout styles */


body, html {
    height: 100%;
    padding: 0;
    margin: 0;
}

#body {
    background-color: #CDC6B9;
    /*overflow-x: hidden;*/
}

#wrapper {
    z-index: 0;
    margin: 0;
    width: 100%;
    min-height: 100%;
}

#header {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 110px;
    background-color: #993300;
    background-image: url(images/wood_pattern01.jpg);
    min-width: 780px;
}

#jgpwslink {
    background-image: url(images/JGPWS_logo_03_gray.jpg);
		width: 100px;
		height: 71px;
		display: block;
		text-indent: -9999px;
		float: left;
		margin: 19px 0 0 19px;
}

#mastheadlogo {
    background-image: url(images/name_banner.gif);
		width: 530px;
		height: 72px;
		display: block;
		text-indent: -9999px;
		margin: 19px auto 0 auto;
}

#left {
    position: fixed;
    z-index: 0;
    width: 160px;
    height: 100%;
    padding-top: 2em;
    background-color: #333333;
    background-image: url(images/diagonals_left.gif);
}

#content {
    position: absolute;
    z-index: 0;
    margin-top: 110px;
    margin-left: 160px;
    padding-bottom: 55px;
    /*width: 100%;*/
    min-width: 620px;
}

#content h2 {
    margin: 0.5em 0 0 1em;
		padding: 0;
}

div.sidebyside_container {
    width: 75%;
		margin: 0 auto 0 auto;
		font-family: Arial, Helvetica, sans-serif;
}

div.images_sidebyside {
		width: 50%;
		float: left;
		text-align: center;
}

div.images_sidebyside img {
    display: inline;
		margin: 1em 0 1em 0;
}

#currentlogo {
    background-image: url(images/masthead_current.png);
}

#digitallogo {
    background-image: url(images/masthead_digital.png);
}

#illuslogo {
    background-image: url(images/masthead_illus.png);
}

#layoutlogo {
    background-image: url(images/masthead_layout.png);
}

#photologo {
    background-image: url(images/masthead_photo.png);
}

#weblogo {
    background-image: url(images/masthead_web.png);
}

#contactlogo {
    background-image: url(images/masthead_contact.png);
}

#currentlogo, #digitallogo, #illuslogo, #layoutlogo, #photologo, #weblogo, #contactlogo {
    width: 400px;
		height: 51px;
		text-indent: -9999px;
}

#navlist ul {
    margin-top: 110px;
    padding: 0;
    list-style-type: none;
    font-size: 0.7em;
    font-family: Arial, Helvetica, sans-serif;
}

#navlist li {
    margin-left: 18px;
}

#navlist a {
    display: block;
    padding-left: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-image: url(assets/button_pf_up.gif);
    background-repeat: no-repeat;
    background-position: 0% 50%;
}

#navlist a:link {
    color: #FFFFFF;
    text-decoration: none;
}

#navlist a:visited {
    color: #FFFFFF;
    text-decoration: none;
}

#navlist a:hover, #navlist a:active {
    color: #FFFF00;
    background-repeat: no-repeat;
    background-position: 0% 50%;
    text-decoration: underline;
    background-image: url(assets/button_pf_over.gif);
}

#active a {
    display: block;
    padding-left: 40px;
    padding-top: 10px;
    padding-bottom: 10px;
    background-image: url(assets/button_pf_over.gif);
    background-repeat: no-repeat;
    background-position: 0% 50%;
    font-weight: bold;
}

#footer {
    position: fixed;
    bottom: 0;
    z-index: 1;
    width: 100%;
    height: 55px;
    background-color: #993300;
    background-image: url(images/wood_pattern01.jpg);
		min-width: 780px;
}

#logo {
    padding-top: 10px;
    padding-bottom: 10px;
}

#containerentryinfo {
    margin-left: 5%;
    margin-right: 5%;
    padding-top: 120px;
    width: 90%;
}

.leftside {
    float: left;
    z-index: 0;
    background-color: #999999;
    padding-left: 5%;
    width: 55%;
    height: 350px;
    border-left: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

.rightside {
    float: left;
    z-index: 0;
    background-color: #999999;
    width : 35%;
    height : 350px;
    border-right: 1px solid;
    border-top: 1px solid;
    border-bottom: 1px solid;
}

#rightside p {
    padding : 10px;
}

/* Content styles */

h1 {
    font-family: Arial, Helvetica, sans-serif;
    font-style: italic;
    font-variant: normal;
    text-transform: capitalize;
}

h3, h4, h5 {
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-variant: normal;
    text-transform: none;
    color: #333333;    
    background-color: #999999;
}

p {
    font-family: Arial, Helvetica, sans-serif;
    font-weight: normal;
    font-size: 0.9em;
    line-height: 1.5;
    color: #333333;
    padding-left: 25%;
    padding-right: 25%;
}

#content table {
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
}

a:link {
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: normal;
    color: #333333;
}	

a:visited {
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: normal;
    color: #660000;
}	

a:hover {
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    color: #0000FF;
}

#content a img {
    border: 2px solid #999999;
}

/* Adjustment styles / Highlights */

#pushdownright {
    padding-top: 120px;
    padding-left: 160px;
}

.footerpadding {
    padding-bottom: 55px;
}

.border {
    border: 1px solid;
}

.centered {
    text-align: center;
}

.highlight {
    background-color: #666666;
    color: #FFFFFF;
}

.highlight a {
    color: #FFFFFF;
}

.highlight a:hover {
    color: #0000FF;
}

.highlight2 {
    background-color: #999999;
}

.padding {
    padding: 10px;
}

.padding25percent {
    padding-left: 25%;
    padding-right: 25%;
}

.margin {
    margin: 10px;
}

.margin25percent {
    margin-left: 25%;
		margin-right: 25%;
}

.smalltext {
    font-size: 0.7em;
}

.floatleft {
    float: left;
}

.clearboth {
    clear: both;
}

/* Background styles */

.bgImage {
    background-image: url(images/watermark_pattern01.gif);
    background-repeat: repeat;
    background-attachment: fixed;
}

.bgWood {
    background-image: url(images/wood_pattern01.jpg);
    background-repeat: repeat;
}

/* Miscellaneous */

.hr {
    border-bottom: 3px double #999999;
    margin-bottom: 20px;
}