/*
Title:			ptz_stylesheet.css
Author:			Mike Bevan

Last Change:	2026-06-29
Status:			Complete and tested, but a work in progress.

Copyright (c) 2008 - 2026 Michael A. Bevan

*/

body
{
 font-family:'Comic Sans MS','Comic Sans';
 font-size: large;
 text-align:left;
// color:white;
// background-color:#00007f;
 background-color:#7f7f7f;
}

/*
===============================================================================
VERTICAL MENU

Vertical Menu Stuff from W3Schools.com
 https://www.w3schools.com/css/css_navbar.asp
 https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_vertical_fixed
*/

#main_menu
{
 font-size:14pt;
 background: black;
 width: 150px;
 position: fixed; /* Make it stick, even on scroll */
 top: 0;
 left: 0;
 height: 100%; /* Full height */
 z-index: 100;
/*  border: 3px solid green; */
}

#main_menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
/*     width: 150px; */
    background: black;
/*     position: fixed; */ /* Make it stick, even on scroll */
/*     height: 100%; */ /* Full height */
    overflow: auto; /* Enable scrolling if sidenav has too much content */
}

#menu-horizontal
{
 text-align: center;
}

.horizontal-menu
{
 text-align: center;
}

#menu-horizontal ul
{
 list-style-type: none;
 padding: 0;
}
 
.horizontal-menu ul
{
 list-style-type: none;
 padding: 0;
}
 
#menu-horizontal li
{
 display: inline;
 padding: 0 5px 0 5px;
}
 
.horizontal-menu li
{
 display: inline;
 padding: 0 5px 0 5px;
}
 
.menu-horizontal
{
 display: inline;
 padding: 0 5px 0 5px;
}
 
#main_menu a:link
{
 display: block;
 padding: 8px 16px;
 text-decoration:none;
 color:white;
}

#main_menu a:visited
{
 display: block;
 padding: 8px 16px;
 text-decoration:none; 
 color:white;
}
#main_menu a:active
{
 display: block;
 padding: 8px 16px;
 text-decoration: none; 
 color: white;
}

#main_menu a:hover
{
 display: block;
 padding: 8px 16px;
 text-decoration:none; 
 color:black; 
 background:white;
}

/*
VERTICAL MENU END
===============================================================================
*/

/*
#hidden-left
{
 position: absolute;
 top: 0;
 left: 0;
 width: 150px;
 padding: 0;
 margin: 0;
}
*/

/*
#content-block
{
 position: absolute;
 top: 0;
 left: 150px;
 min-width: 1000;
 padding: 0;
 margin: 0;
}
*/

/*
#content-block
{
 margin: 0 0 0 150;
 width: 100%;
}
*/

#content-main
{
 margin-left:150px;
 padding:1px 16px;
 min-width: 1024px;
/*  border: 3px solid blue; */
}

/*
#content-right
{
 position: fixed;
 height: 100%;
 left: 1130px;
 width: 150px;
 background: black;
 color: white;
}
*/

/*
#hidden-right
{
 position: absolute;
 left: 1130px;
 width: 150px;
 padding: 0;
 margin: 0;
}
*/

#div-navigation
{
 padding-top: 5px;
 padding-bottom: 5px;
}

#gen_footer
{
 padding:0 1px 16px 1px;
 clear: both;
}

#home-pic
{
 width: 720px;
 height: 540px;
 border: 4px solid black;
 border-style: double;
 margin-left:auto; 
 margin-right:auto; 
}

#pops-pic
{
 width: 960px;
 height: 540px;
 border: 4px solid black;
 border-style: double;
 margin-left:auto; 
 margin-right:auto; 
}

#marvin-pic
{
 width: 960px;
 height: 540px;
 border: 4px solid black;
 border-style: double;
 margin-left:auto; 
 margin-right:auto; 
 margin-top: 5em;
 }

.no-class
{
}

.added-info
{
 font-size: .7em;
}

.footer
{
/*  margin-left:150px; */
 font-size:.7em;
 color: white;
 text-align: center;
 clear: both;
}

/* Link Attributes */

/* Generic Links */
a:link { text-decoration: none; color: #00007f; padding: 5px; }
a:visited { color: #00007f; text-decoration: none; padding: 5px; }
a:active { color: #00007f; text-decoration: none; padding: 5px; }
a:hover { background: #00007f; color: white; padding: 5px; }

/* blacklink */
a.blacklink:link { text-decoration:none; color:black; padding: 5px; }
a.blacklink:visited { text-decoration:none; color:black; padding: 5px; }
a.blacklink:active { text-decoration:none; color:black; padding: 5px; }
a.blacklink:hover 
{
 text-decoration:none;
 color:white;
 background:black;
 padding: 5px;
}

/* redlink */
a.redlink:link { text-decoration:none; color:white; padding: 5px; }
a.redlink:visited { text-decoration:none; color:white; padding: 5px; }
a.redlink:active { text-decoration:none; color:white; padding: 5px; }
a.redlink:hover
{
 text-decoration:none;
 color:white;
 background:#af0303;
 padding: 5px;
}

/* returnlink */
a.returnlink:link
{
 text-decoration:none;
 color:black;
 background:white;
 padding: 5px;
}
a.returnlink:visited
{
 text-decoration:none;
 color:black;
 background:white;
 padding: 5px;
}
a.returnlink:active
{
 text-decoration:none;
 color:black;
 background:white;
 padding: 5px;
}
a.returnlink:hover
{
 text-decoration:none;
 color:white;
 background:black;
 padding: 5px;
}

/* triplink */
a.triplink:link { text-decoration:none; color:#ffffe7; padding: 5px; }
a.triplink:visited { text-decoration:none; color:#ffffe7; padding: 5px; }
a.triplink:active { text-decoration:none; color:#ffffe7; padding: 5px; }
a.triplink:hover
{
 text-decoration:none;
 color:#ffffe7;
 background:#98b0d6;
 padding: 5px;
}

/* whitelink */
a.whitelink:link { text-decoration:none; color:white; }
a.whitelink:visited { text-decoration:none; color:white; }
a.whitelink:active { text-decoration:none; color:white; }
a.whitelink:hover { text-decoration:none; color:black; background:white; }

/* yellowlink */
a.yellowlink:link { text-decoration:none; color:yellow; padding: 5px; }
a.yellowlink:visited { text-decoration:none; color:yellow; padding: 5px; }
a.yellowlink:active { text-decoration:none; color:yellow; padding: 5px; }
a.yellowlink:hover
{
 text-decoration:none;
 color:yellow;
 background:blue;
 padding: 5px;
}

/* Button Attributes */
.generic-button
{
/*  text-decoration:none;
 color:#af0303;
 background:white; */
 border-radius: 6px;
/*  padding: 5px; */

}

.generic-button:hover
{
/*  text-decoration:none;
 color: white;
 background: #af0303; */
 border-radius: 6px;
/*  padding: 5px; */

}

.dir-button
{
 text-decoration:none;
/*  color: #03af03; */
 color: black;
 background: #d2b48c;
 border-radius: 6px;
/*  padding: 5px; */

}

.dir-button:hover
{
 text-decoration:none;
 color: #d2b48c;
 background: #03af03;
 border-radius: 6px;
/*  padding: 5px; */

}

.maroon-pics
{
/*  text-decoration:none; */
 color: #800000;
 background: white;
 border-radius: 6px;
/*  padding: 5px; */

}

.maroon-pics:hover
{
/*  text-decoration:none; */
 color: white;
 background: #800000;
 border-radius: 6px;
/*  padding: 5px; */

}

.red-pics
{
/*  text-decoration:none; */
 color: #af0303;
 background: white;
 border-radius: 6px;
/*  padding: 5px; */

}

.red-pics:hover
{
/*  text-decoration:none; */
 color: white;
 background: #af0303;
 border-radius: 6px;
/*  padding: 5px; */

}

.rufus-pics
{
/*  text-decoration:none; */
 color: blue;
 background: yellow;
 border-radius: 6px;
/*  padding: 5px; */

}

.rufus-pics:hover
{
/*  text-decoration:none; */
 color: yellow;
 background: blue;
 border-radius: 6px;
/*  padding: 5px; */

}

.page-pic
{
 margin-top: 64px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
}

.inactive
{
 display: block;
 padding: 8px 16px;
 color: #A0A0A0;
 text-decoration: none;
}

.line-darkred-90
{
 width: 90%;
}

.line-darkred-45
{
 width: 45%;
}

.line-darkred-50
{
 width: 50%;
}

.line-darkred
{
 text-align: center;
 height: 0px;
 border-top: 2px solid darkred;
 margin-left:auto; 
 margin-right:auto;
 margin-bottom: 35px;
}

.line-darkgray
{
 text-align: center;
 height: 0px;
 border-top: 2px solid darkgray;
 margin-left:auto; 
 margin-right:auto;
 margin-bottom: 35px;
}

h1
{
 font-size: 2em;
 text-align: center;
}

table.ptz_table
{
 font-family:'Comic Sans MS','Comic Sans';
 background-color:white;
 color:black;
 font-size:15pt;
 font-weight:normal;
 text-align:center;
}

td.trails_table
{
 padding: 5px;
 border: none;
 font-family:'Comic Sans MS','Comic Sans';
 background-color:white;
 color:black;
 font-size:0.75em;
 font-weight:normal;
}

.ptz_header
{
 font-family:'Comic Sans MS','Comic Sans';
 font-size:35pt;
 font-weight:bold;
 text-align:center;
}

.h1-c
{
 font-size: 2.0em;
 text-align: center;
}

.h2-c
{
 font-size: 1.7em;
 text-align: center;
}

.h3-c
{
 font-size: 1.25em;
 text-align: center;
}

.spacebelow-35
{
 margin-bottom: 35px;
}

.center
{
 text-align: center;
}

.center-75
{
 margin-left: auto;
 margin-right: auto;
 width: 75%;
}

.fontsize-standard
{
 font-size: 12pt;
}

.center-bymargin
{
 margin-left:auto; 
 margin-right:auto; 
}

.emphasis
{
 font-family: 'Times New Roman';
 font-variant: small-caps;
 font-weight: bold;
}

.stand-out
{
 font-family: 'Times New Roman';
 font-weight: bold;
}

.side-by-side
{
 display: inline-block;
 vertical-align: top;
/*  width: 31%; */
 min-width: 500px;
/* inline-size: min-content; */
 padding: 5px 5px 5px 5px;
}

.inline-box
{
 display: inline-block;
 vertical-align: top;
 width: 31%;
 min-width: 330px;
/* inline-size: min-content; */
 padding: 5px 5px 5px 5px;
}

.picture-box
{
 display: inline-block;
 width: 35%;
 min-width: 370px;
 padding: 5px 0 5px 5px;
}

.text-box
{
 display: inline-block;
 vertical-align: top;
 width: 60%;
/*  min-width: 610px: */
 padding: 5px 5px 5px 1%;
}

.text-box-50
{
 display: inline-block;
 vertical-align: top;
 width: 45%;
/*  min-width: 610px: */
 padding: 5px 5px 5px 1%;
}

.standard-paragraph
{
 vertical-align: top;
 padding: 5px;
}

.standard-paragraph-50
{
 vertical-align: top;
 padding: 5px;
 margin-left: 25%;
 margin-right: 25%;
}

.standard-paragraph-75
{
 vertical-align: top;
 padding: 5px;
 margin-left: 13%;
 margin-right: 12%;
}

p.instruction-paragraph
{
 vertical-align: top;
 padding: 5px;
 text-align: center;
 font-size: 1.5em;
}

p.navigation
{
 padding-top: 5px;
 padding-bottom: 5px;
}

ol.cruise-list-center
{
 margin-left: auto;
 margin-right: auto;
 width: 400px;
}

ul.cruise-list-center
{
 margin-left: auto;
 margin-right: auto;
 width: 150px;
}

.fixed
{
 font-family:'Courier 10 Pitch', monospace, system;
 font-size:11pt;
}

.note
{
 padding: 5px;
 font-size:.7em;
 font-weight:bold;
 color: #191970;
}

.red
{
 color: red;
}

.darkred
{
 color: darkred;
}

.navy
{
 color: navy;
}

.picture_right
{
 margin: 10px;
}

.float_left
{
 float: left;
}

.float_right
{
 float: right;
}

.float_nofloat
{
 clear: both;
}