/*
Set External Sources
*/

/*
@import url(hpm_extr.css);
*/

/*
Set CSS Defaults
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}

* {
box-sizing: border-box;
}

/*
Set CSS Contents
*/

body {
padding: 0;
margin: 0;
font-size: 11pt;
line-height: 1.25em;
font-family: Verdana,sans-serif,helvetica,arial;
background: #FFFFFF;
color: #333333;
}

header {
background: #333333;
width: 100%;
padding: 10px;
height: 124px;
position: absolute;
top: 0;
left: 0;
border-bottom: 6px solid #FF9900;
z-index: 100;
float: left;
}

b {
font-weight: bold;
}

i {
font-style: italic;
}

a:link {
color: #FF9900;
background-color: transparent;
text-decoration: none;
}

a:active {
color: #FF9900;
background-color: transparent;
}

a:visited {
color: #FF9900;
background-color: transparent;
}

a:hover {
color: #FF9900;
background-color: transparent;
text-decoration: underline;
}

ul {
list-style: none;
}

li {
display: inline-block;
float: left;
padding: 10px
}

ul.mainlist {
list-style-position: outside;
list-style-type: disc;
float: none;
display: block;
margin-left: 10px;
padding: 5px
}

li.mainlist {
float: none;
display: list-item;
margin-left: 10px;
padding: 5px
}

span.headmain {
font-size: 18pt;
color: #FF9900;
font-weight: bold;
}

span.headsub1 {
font-size: 12pt;
color: #333333;
font-weight: bold;
font-style: italic;
}

div.mainmenu {
float: right;
font-size: 12pt;
padding-top: 0px;
padding-right: 0px;
}

nav {
float: right;
padding: 10px;
width: 100%;
}

ul.navibar1 {
list-style-type: none;
margin: 0;
padding: 5px;
overflow: hidden;
}

a.menulink:link {
color: #333333;
background-color: transparent;
text-decoration: none;
font-weight: bold;
}

a.menulink:active {
color: #333333;
background-color: transparent;
font-weight: bold;
}

a.menulink:visited {
color: #333333;
background-color: transparent;
font-weight: bold;
}

a.menulink:hover {
color: #FF9900;
background-color: transparent;
font-weight: bold;
}

section {
margin: 150px auto 40px;
max-width: 980px;
position: relative;
padding: 20px
}

h1.sectlbl1 {
display: none;
}

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

img.magslogo {
  border: 2px solid #333333;
  border-radius: 0px;
  padding: 0px;
}

img.magsstor {
  padding: 0px;
}

img.blogimgs {
  float: none;
  margin: 0px;
}

img.downlink {
  float: left;
  vertical-align: middle;
  margin-left: 5px;
}

div.mainimg {
position: relative;
}

div.imgtext {
font-size: 18pt;
text-align: center;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #666666;
background: rgb(102, 102, 102);
background: rgba(102, 102, 102, 0.7);
color: #FF9900;
padding: 20px;
width:75%;
border-radius: 10px;
}

div.imgoverlay {
font-size: 14pt;
text-align: center;
position: absolute;
top: 40px;
right: 40px;
background-color: #FFFFFF;
background: rgb(255, 255, 255);
background: rgba(255, 255, 255, 0.7);
color: #000066;
padding: 20px;
}

div.photcopy {
font-size: 9pt;
}

div.thirdcol {
float: left;
width: 33.3333%;
}

div.twincols {
float: left;
width: 50.0000%;
padding: 20px;
}

div.colsblock {
}

.colsblock::after {
content: "";
clear: both;
display: table;
}

div.footer {
background: #333333;
color: #FF9900;
font-size: 9pt;
width: 100%;
height: 40px;
border-top: 6px solid #FF9900;
padding: 6px;
}


@media only screen and (max-width: 640px) {

div.thirdcol {
display: inline-block;
width: 100%;
}

div.twincols {
display: inline-block;
width: 100%;
}

div.imgtext {
font-size: 12pt;
padding: 10px;
}

div.imgoverlay {
font-size: 12pt;
padding: 10px;
}

div.mainmenu {
float: left;
font-size: 9pt;
width: 100%;
}

section {
padding-top: 280px;
}

ul.navibar1 {
float: none;
display:block;
list-style-type: none;
margin: 0;
padding: 5px;
overflow: hidden;
}

li.navibar1 {
float: none;
display: block;
font-size: 18pt;
padding-top: 20px;
padding-right: 0px;
text-align: center;
}

}



/*
Enable Dark Mode if supported
*/

/*
@media (prefers-color-scheme: dark) {

body {
padding: 0;
margin: 0;
font-size: 11pt;
line-height: 1.25em;
font-family: Verdana,sans-serif,helvetica,arial;
background: #000000;
color: #CCCCCC;
}

a.menulink:link {
color: #CCCCCC;
background-color: transparent;
text-decoration: none;
font-weight: bold;
}

a.menulink:active {
color: #CCCCCC;
background-color: transparent;
font-weight: bold;
}

a.menulink:visited {
color: #CCCCCC;
background-color: transparent;
font-weight: bold;
}

a.menulink:hover {
color: #FF9900;
background-color: transparent;
font-weight: bold;
}

span.headsub1 {
font-size: 12pt;
color: #CCCCCC;
font-weight: bold;
font-style: italic;
}

}
*/