body {margin:0;}

h4 {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:14px;font-weight:bold;}

div#footer {clear:both; font:100% Verdana,sans-serif; text-align:right;font-style: italic}

#masthead{position: fixed; top: 0px; left: 140px; width: 100%; height: 140px; background-image: url(panorama1.jpg);
	background-position: left; margin:0; margin-right:20px;  background-repeat: repeat-x;
	background-color: #8298af; opacity:0.95; z-Index:1;
}

#masthead h1 {font-family: sans-serif; font-size: 4em;  color:blue; text-align: center;}

div#links {position: fixed; top: 95px; left: 0; width: 140px; height: 700px; background-image: url(canada.jpg); background-position: 5px 45px; background-repeat:no-repeat;}

div#links a {display:block;border-bottom: thin ridge silver;text-align:right;text-decoration:none;
	margin-left:30px; margin-right:10px;margin-top:7px;color: silver; font: 12px Verdana, sans-serif; }
	
div#links a:hover{color: black;}

div#content {position: absolute; top: 145px; left: 141px; right: 25px;  padding: 10px;
             border-left: 1px solid silver;border-right: 1px solid silver; 
             color: black; font: 12px Verdana, sans-serif;text-align:justify; overflow:hidden;
             z-Index:-1;
}

div.pic {float:left;width:300px; height:270px;margin:20px;margin-left:35px;border: 2px solid lightslategray;background-color:#eeeeee;}

div.ls img {width:auto;/* height:150px;*/border: 1px solid;margin-top:30px; display:block; margin-left:auto; margin-right:auto;}

div.pt img {/*width:150px;*/ height:auto ;border: 1px solid;margin-top:10px; display:block; margin-left:auto; margin-right:auto;}



div#content div p.pic {font-family:Verdana, Arial,Helvetica,sans-serif;font-size:10px;font-weight:normal;
                          text-align:center;margin:0; margin-top:6px;}
                         
                          
.float {float:left;margin-right:20px; margin-bottom:5px;}

hr {clear:both;}

p {margin-left:15px; margin-top:0; }

p.date {padding:0; font: italic bold 16px Georgia, serif; color:blue; margin:10px; margin-left:10px; margin-bottom:3px; clear:both}



.fadeIn {  animation: fadeIn1 3s;  animation-timing-function: ease;
           animation-fill-mode: forwards; display:block;
}



.fadeOut {  animation: fadeOut1 3s;  animation-timing-function: ease;
            animation-fill-mode: forwards;
}

@keyframes fadeIn1 {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeOut1 {
  from {opacity: 1;}
  to {opacity: 0; }
}

div#slideshow{display:none;opacity:0.00; height:100vh; width:100vw;}

div#controls {margin-top:0vh;margin-left:0vw;}
div.control img {width:4vw;}

div.picSub {display:none; position:absolute;margin:0; left:7vw; top:1vh;
            opacity:0.00; max-height:100vh;max-width:100vw; }
            
div.picSub img {max-height:90vh; max-width:90vw;}
            


p.pic {font-size:1.5vw; text-align:center; margin:0}