/* main style sheet */

@media (max-width: 800px) {
  /* Mobile layout */
.title {margin:0; padding:5px; background-color: #3298c8; font-size:1.5em; color:yellow; text-align:center; font-weight:bold}

.hide {display:none;}
.box {overflow-x:auto}
.log {position:absolute; right:5px; font-size:0.7em; color:black; top:25px}
.lphoto img {width:100%; height:auto; padding-top:8px;}

.leftimg, .rightimg, .centreimg {width:100%; height:auto; border:1px solid #000;}
.leftimg2 {float:left; margin-right:10px;}
.rightimg0 {float:right; margin:0px;}
.rightimg2 {float:right; margin-left:10px;}
.centreimg0 {margin:0px; border:1px solid #000;}
.centreimg2 {margin-left:10px; margin-right:10px;}
.centreimg3 {max-width: 75%; margin-left:10px; margin-right:10px; margin-bottom:5px}
.centreimg4 {margin:1px;}

.hleftimg, .hleftimg2, .hcentreimg0, .hcentreimg, .hcentreimg2, .hrightimg, .hrightimg2 {display:none;}

.pledit {width:100%; margin:0;}
.predit {width:100%; margin:0; padding:10px 0px}
.peimg {max-height:300px; max-width:80%;}
.ptext {width:90%; height:200px;}
.pdate {width:25%; margin-top:5px;}
.pname {width:50%; margin-top:5px;}

.cttext {text-align:center;}
.lctext {text-align:center; margin-left:5%; margin-right:5%}
.pdf-disp {width:650px; height:400px;}
.photomod {max-width:90%;}
textarea {max-width:90%;}

.fs75box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:90%; vertical-align:middle;}
.fsc55box {display:inline-block; margin:0px; padding: 0px; text-align: center; width:85%; vertical-align:middle;}
.fs50box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:85%; vertical-align:middle;}
.fsc45box {display:inline-block; margin:0px; padding: 0px; text-align: center; width:80%; vertical-align:middle;}
.fs40box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:80%; vertical-align:middle;}
.fs25box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:60%; vertical-align:middle;}
.fs20box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:40%; vertical-align:middle;}
.fs15box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:40%; vertical-align:middle;}
.boxed {display:inline-block; border:10px solid blue; width:40%; margin:0px; padding:15px; font-size:1.7em; color:red; font-weight:bold; vertical-align:middle;} 
.boxed2 {display:inline-block; border:10px solid orange; width:80%; margin:0px; padding:5px; vertical-align:middle;}

.thumbnail span, .thumbnail span img, .thumbnail:hover span {display:none;}

.thumbnail{
position: relative;
z-index: 1;
}

.thumbnail:hover{
background-color: transparent;
z-index: 1;
}

}
  
  @media (min-width: 800px) {
  /* Desktop layout */

.title {margin:0; padding:5px; background-color: #3298c8; font-size:2.5em; color:yellow; text-align:center; font-weight:bold}
.log {position:absolute; right:5px; font-size:0.7em; color:white; top:3px}
.lphoto img {width:100%; height:auto; padding-top:15px;}

.leftimg, .hleftimg {float:left; margin:10px; border:1px solid #000;}
.leftimg2, .hleftimg2 {float:left; margin:10px;}
.rightimg0, .hrightimg2 {float:right; margin:0px;}
.rightimg, .hrightimg {float:right; margin:10px; border:1px solid #000;}
.rightimg2, .hrightimg2 {float:right; margin:10px;}
.centreimg0, .hcentreimg0 {margin:0px; border:1px solid #000;}
.centreimg, .hcentreimg {margin:10px; border:1px solid #000;}
.centreimg2, .hcentreimg2 {margin:10px;}
.centreimg3, .hcentreimg3 {margin:10px;}
.centreimg4, .hcentreimg4 {margin:1px;}

.pledit {display:inline-block; width:33%; margin:0;}
.predit {display:inline-block; width:66%; margin:0; padding:10px 0px}
.peimg {max-height:300px; max-width:95%;}
.ptext {width:90%; height:200px;}
.pdate {width:20%; margin-top:5px;}
.pname {width:40%; margin-top:5px;}

.cttext {text-align:center; margin-left:5%; margin-right:5%;}
.lctext {text-align:left; margin-left:5%; margin-right:5%}
.pdf-disp {width:1000px; height:800px;}

.fs75box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:75%; vertical-align:middle;}
.fsc55box {display:inline-block; margin:0px; padding: 0px; text-align: center; width:55%; vertical-align:middle;}
.fs50box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:50%; vertical-align:middle;}
.fsc45box {display:inline-block; margin:0px; padding: 0px; text-align: center; width:45%; vertical-align:middle;}
.fs40box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:40%; vertical-align:middle;}
.fs25box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:25%; vertical-align:middle;}
.fs20box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:20%; vertical-align:middle;}
.fs15box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:15%; vertical-align:middle;}
.boxed {display:inline-block; border:10px solid blue; width:20%; margin:0px; padding:15px; font-size:1.7em; color: red; font-weight:bold; vertical-align:middle;} 
.boxed2 {display:inline-block; border:10px solid orange; width:65%; margin:0px; padding:5px; vertical-align:middle;}

.thumbnail{
position: relative;
z-index: 1;
}

.thumbnail:hover{
background-color: transparent;
z-index: 1;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
z-index: 1;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
z-index: 50;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -250px; /*position where enlarged image should offset vertically */
left: 100px; /*position where enlarged image should offset horizontally */

z-index: 50;
}

}



/* Common styling */
html {
height:100%; 
max-height:100%; 
padding:0;
margin:0; 
border:0; 
background:#F0F5FB; 
font-family:Verdana, Helvetica, Lucida Sans, arial, sans-serif;
}

body {margin:0}

#content {width:100%; font-size:0.85em}

#foot {margin:0; width:100%; height:25px;background-color:black; color:white; text-align:center;  font-size:0.7em; font-weight:normal; padding-top:10px}

dl {margin-top:10px}
dd {display:none;}

a.nav, a.nav:link, a.nav:visited, a.nav:active {margin-left:15px; display:block; background:transparent; width:160px; border:2px solid #000; text-decoration:none; text-align:center; line-height:23px; font-weight:bold; font-family:sans-serif; padding:2px; background:transparent; color:yellow; margin-top:2px}

a.nav:hover {background:#0099ff; color:#ffffff;  }

a.back, a.back:link  {margin-left:15px; display:block; background:transparent; width:160px; border:2px solid #000; text-decoration:none; text-align:center; line-height:23px; font-weight:bold; font-family:sans-serif; padding:2px; background-color:#5887D1; filter:alpha(opacity=60); opacity:0.6; color:#5887D1; margin-top:2px}


a.footer, a.footer:link a.footer:visited, a.footer:active {color:white}
a.footer:hover {color:red}

a.main, a.main:link, a.main:visited, a.main:active {color:blue; font-weight:bold}
a.main:hover {color:red}

a.main2, a.main2:link, a.main2:visited, a.main2:active {color:blue; font-weight:bold; text-decoration:none;}
a.main2:hover {color:red}

a.Wenter, a.Wenter:link, a.Wenter:visited, a.Wenter:active {color:#FF3399; font-weight:bold; text-decoration:none;}
a.Wenter:hover {color:black}

.c10text {text-align:center; margin-left:10%; margin-right:10%}
.c5text {text-align:center; margin-left:5%; margin-right:5%}
.c2text {text-align:center; margin-left:10px; margin-right:10px}
.c0text {text-align:center}
.l10text {text-align:left; margin-left:10%; margin-right:10%}
.l5text {text-align:left; margin-left:5%; margin-right:5%}
.l2text {text-align:left; margin-left:10px; margin-right:10px}
.l0text {text-align:left;}

.footer {margin-top:0px; text-align:center;  font-size: 0.7em}
.photos {text-align:center}
#count {text-align:center}

h2 { font-size:1.8em}
h3 { font-size:1.3em}
h4 { font-size:1.0em}
#small { font-size:0.75em}
#pronly {display:none;font-size:0.75em}

#show { text-align:left;font-size:13px;margin-left: auto;margin-right: auto;border:0px}
#show td {padding-left:3px;padding-right:3px;padding-top:3px;padding-bottom:3px;border:0px}

.mar00 {margin-top:0px; margin-bottom:0px;}
.mar03, li {margin-top:0px; margin-bottom:3px;}
.mar06 {margin-top:0px; margin-bottom:6px;}
.mar0A {margin-top:0px; margin-bottom:15px;}
.marA0 {margin-top:15px; margin-bottom:0px;}
.mar60 {margin-top:6px; margin-bottom:0px;}
.mar30 {margin-top:3px; margin-bottom:0px;}
.mar33 {margin-top:3px; margin-bottom:3px;}
.mar36, ul, ol {margin-top:3px; margin-bottom:6px;}
.mar3A {margin-top:3px; margin-bottom:15px;}
.marA3 {margin-top:15px; margin-bottom:3px;}
.mar63 {margin-top:6px; margin-bottom:3px;}
.mar66 {margin-top:6px; margin-bottom:6px;}
.mar6A {margin-top:6px; margin-bottom:15px;}
.marA6 {margin-top:15px; margin-bottom:6px;}
.marAA {margin-top:15px; margin-bottom:15px;}

.red {color:red;}
.blue {color:blue;}
.green {color:green;}
.tab0 { text-align:center;font-size:12px;margin-left: auto;margin-right: auto;border:0px}
.tab0 td {padding-left:3px;padding-right:3px;}
.tab0 th {font-size:16px;padding-left:3px;padding-right:3px;}

.tab0c { text-align:center;font-size:12px;margin-left: auto;margin-right: auto;border:0px}
.tab0c td {padding-left:3px;padding-right:3px;}
.tab0c th {font-size:16px;padding-left:3px;padding-right:3px;}

.tab1 { text-align:center; font-size:12px; margin-left: auto; margin-right: auto; border:3px outset #D3D3D3;border-collapse:collapse}
.tab1 td { padding-left:3px;padding-right:3px;border:1px solid gray}
.tab1 th {font-size:16px; border-color:gray; border-style:solid; border-width:1px 1px 3px 1px;padding-left:3px;padding-right:3px;}
.tleft {text-align:left;}

.lcap-R {font-size:0.85em; text-align:right; margin-top:0px; margin-bottom:3px;}
.lcap {font-size:0.85em; text-align:center; margin-top:3px; margin-bottom:10px;}

.banner {max-width:100%; height:152px; overflow:hidden}

.photosort {max-width:100%;}
.photosort2 {max-width:75%;text-align:center;}
.pgall {display:inline-block; width:350px; margin:0px; padding: 10px 0px;}
.psort {display:inline-block; width:205px; margin:0px; padding: 10px 0px;}
.pgimg {max-height:300px; max-width:300px;}
.psimg {max-height:200px; max-width:200px;}
.pstext {width:40%; margin-top:5px;}
.psnum {width:15%; margin-top:5px;}
.pebox {max-width:100%;}

.photomod {max-width:75%; margin-left:12%;}
.modb {display:inline-block; width:205px; margin:0px; padding: 10px 0px;}
.mimg {max-height:200px; max-width:200px;}

.catitem {display:inline-block; width:200px; height:40px; text-align: left; vertical-align: text-top;}

.lefticon {float:left; margin:10px; border:1px solid #000;}
.righticon {float:right; margin:10px; border:1px solid #000;}

.fgall {color:blue; font-weight:bold; font-style: italic;}
.rgall {color:black; font-weight:bold; font-style: normal;}
.Nsel {color:blue; font-weight:bold; font-style: italic;}
.Ysel {color:black; font-weight:bold; font-style: normal;}

.desbox {display:inline-block; margin:0px; padding: 0px; max-width:100%; text-align:center;}
.dimg {max-height:120px; max-width:120px; margin:5px;}
.menbox {display:inline-block; margin:0px; padding: 0px; max-width:100%; text-align:center;}
.menimg {max-height:50px; margin:0px; padding: 0px;}

.Wbox {display:inline-block; border:5px; border-style:double; width:70%; margin:10px; padding:5px; background-color: pink; vertical-align:middle;}

.fpbox {display:inline-block; margin:15px; padding: 0px; text-align: center; width:100px; vertical-align:top;}
.f95box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:95%; vertical-align:middle;}
.f75box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:75%; vertical-align:middle;}
.f60box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:60%; vertical-align:middle;}
.f50box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:50%; vertical-align:middle;}
.f40box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:40%; vertical-align:middle;}
.f35box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:35%; vertical-align:middle;}
.f30box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:30%; vertical-align:middle;}
.f25box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:25%; vertical-align:middle;}
.f20box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:20%; vertical-align:middle;}
.f15box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:15%; vertical-align:middle;}
.f10box {display:inline-block; margin:0px; padding: 0px; text-align: left; width:10%; vertical-align:middle;}
.nordir {direction:ltr;}
.revdir {direction:rtl;}
.small { font-size:80%}

/* unclicked style div.more */
.l5text div.more i {cursor:pointer; color:#C00; font-weight:bold;}
.l5text div.more i.hide {display:none;}
.l5text div.more ul {display:none;}
.l5text div.more img {display:none;}

/* clicked style div.click */
.l5text div.click i.show {display:none;}
.l5text div.click i.hide {display:block;}
.l5text div.click ul {display:block;}
.l5text div.click img {display:block; float:left; padding-right:10px;}

.page-break	{ display: none; }

.indent1 {margin-left:75px;}
.indent2 {margin-left:100px;}