/*
   Stylesheet for the West Kingdom College of Heralds
   Created by the Golem Herald Hirsch von Henford (mka Ken Mayer)
*/

html
{
   /* for fixed footer */
   position: relative;
   min-height: 100%;
}

body 
{  
   font-family: Arial, Helvetica, sans-serif; 
   font-size: 17px; 
   color: #000000; 
   background-color: #FFFFFF;
   margin-top: 10px;
   margin-left: 15px;
   margin-right: 15px;
   /* for fixed footer */
   margin-bottom: 40px;
}

footer
{
   width: 98%;
   margin-top: 10px;
   padding-top: 10px;
   height: 40px;
   text-align: center;
   background-color: green;
   color: yellow;
   /* for fixed footer */
   position: absolute;
   bottom: 0;
}

.PageTitle, .SecondaryHeader, .TertiaryHeader
{  
   font-family: Arial, Helvetica, sans-serif; 
   font-weight: bold;	  
   background-color: #007B00;
   color: #FFFFFF;
   text-decoration: none;
   padding: 0px 0px 3px 0px;
}

.PageTitle
{
   /* from Google fonts ... */
   font-family: Fondamento;
   font-size: 24px; 
   text-align: center;
}	

.SecondaryHeader 
{  
   font-size: 22px; 
   padding: 3px 0px 3px 3px;
}

.TertiaryHeader 
{ 
   font-size: 20px; 
   padding: 3px 0px 3px 3px;
}

.SecondaryNoBack, .TertiaryNoBack
{  
   font-family: Arial, Helvetica, sans-serif; 
   font-weight: bold;	  
   color: #007B00;
   text-decoration: none;
}

.SecondaryNoBack
{  
   font-size: 22px; 
}

.TertiaryNoBack
{ 
   font-size: 20px; 
}

.SubmissionName
{ 
   font-family: Arial, Helvetica, sans-serif; 
   font-weight: bold;	  
   font-size: 20px;
   text-decoration: none;
}

.BreadCrumb
{
   font-size: 17px;
   color: grey;
   text-align: center;
}

a.BreadCrumb
{
    font-size: 17px;
}
a.BreadCrumb:link 
{
   color: grey;
   font-size: 17px;
}
a.BreadCrumb:visited 
{
   color: grey; 
}
a.BreadCrumb:hover 
{
   color: green;
}
a.BreadCrumb:active 
{
   color: grey;
}

blockquote
{
   font-family: var( --site-font ) !important; /* Arial, Helvetica, sans-serif !important; */
   font-size: 16px !important;
   border: none !important;
   margin-left: 30px; /* added September, 2018, for Bootstrap 4.1.3 */
   margin-bottom: 0px;
}

.yellowNote 
{ 
   font-size: 17px;
   text-align: justify;
   width: 50%;
   padding: 6px;
   background-color: #FFFFCC;
   color: black;
   border: solid;
   border-width: 1px;
   border-left-width: 3px;
   border-color: #FF6600;
   border-radius: 7px;
}
   
/* do I still need this? */   
.RedWhiteNote 
{ 
   font-size: 17px;
   text-align: justify;
   width: 50%;
   padding: 6px;
   background-color: red;
   color: white;
   border: solid;
   border-width: 3px;
   border-color: black;
   border-radius: 7px;
}
   
/*
   --------------------------------------------------------------------------------------
   DIVS used for pages on this site that display in multiple columns. We're working on
   removing the reliance on tables, these definitions are for pages like the
   main index.htm, where the page is laid out in two distinct columns ... 
   
   These are based on a webpage I lifted them from:
      http://webhost.bridgew.edu/etribou/layouts/rMenu/index.html
   I wasn't interested in his menus for this website, but the two-column
   layout with the DIV styles ...
   --------------------------------------------------------------------------------------
*/
div.two-columns /* The big division */
{
   width: 100%;
   display: inline-block;	/* for IE/Mac to contain its child elements */
   /* \*/ display: block;	/* override above rule for every other 
                                browser using IE/Mac backslash hack */
}
   
div.two-columns:after
{
   content: "."; 
   display: block; 
   height: 0; 
   clear: both; 
   visibility: hidden;
}
   
div.two-columns, 
div.two-columns div.left-column,
div.two-columns div.right-column
{
   border: solid 1px #007B00;
   border-width: 1px;
}
   
div.two-columns div.left-column,
div.two-columns div.right-column
{
   float: left;
   width: 50%;
   border-width: 0 1px 0 0;
   margin: 0 -1px;
}

* html div.two-columns div.left-column,
* html div.two-columns div.right-column
{
   position: relative;	/* IE/Win 6 and earlier need this */
}

div.two-columns div.right-column
{
   border-width: 0 0 0 1px;
   margin-right: -3px;
   margin-left: 0;	
}

div.two-columns div.inside-column
{
   padding: 1px 10px;	/* 1px is there to get past a margin rendering
                            bug in Netscape 7 and older FireFox */
}
/*
   End of the DIVS for the columns ...
   --------------------------------------------------------------------------------------   
*/

/* For the Heralds' Minutes */
.report_paragraph
{
   text-indent: 20px;
}

.submission
{
   margin-bottom: 5px;
   margin-top: 10px;
}
	
.sub-image
{
   /* top right bottom left*/
   margin: 20px 10px 10px 10px;
   clear: both;
}
	
.sub-body
{
   margin-left: 15px;
	margin-right: 10px;
}

.armory
{
   width: 250px;
   float: right;
   border: none;
}
	
.clearfix
{
   overflow: auto;
}

/* submission name paragraph that has an image: */
.name_with_image
{
   margin-bottom: 20px;
}

/* These two are for the officer reports (added May, 2019) */
.report_paragraph
{
   margin-top: 0;
   margin-bottom: 0;
}
.left_indent
{
   text-indent: 20px;
}



/* default table */
table
{
   border-style: none;
   border-width: 0px;
}
table tr, th, td
{
   border-style: none;
   border-width: 0px;
   font-family: Arial, Helvetica, sans-serif; 
   font-size: 17px;
}   

/* Table with alternating rows, colored heading ... */
   
table.colored 
{ 
   border: 1px solid #007B00;
   border-collapse: collapse; 
   background-color: #FFFFFF; 
   color: #FFFFFF; 
   font: 17px Arial, Helvetica, sans-serif; 
   width: 100%; 
} 
      
table.colored tr 
{ 
   vertical-align: top; 
   background-color: #FFFFFF;
   color: #000000; 
} 
      
table.colored tr.even 
{ 
   background-color: #D9FFDE; 
   color: #000000; 
}    
      
table.colored th 
{ 
   border: 1px solid #007B00;
   background-color: #007B00; 
   color: #FFFFFF; 
   padding: 0.2em; 
   text-align: center; 
   font-size: 17px ; 
   font-weight: bold;
} 
   
table.colored td 
{ 
   font-size: 17px ; 
   padding: 0.2em; 
   border: 1px solid #007B00; 
}

/* Horizontal Rule */
hr
{
   border: 0;
   color: #007B00;
   background-color: #007B00;
   height: 1px;
}

/* 
   --------------------------------------------------------------------------------------
   LINKS  -- based on issue 162 of Practical Web Design, the CSS Tutorial section
   on working with Links ... slightly modified here and there, but the idea is the same ... 
   
   What I've done, because the links get embedded in the text in lots of places (the funky spacing
   is ... odd), is to copy the original, remove the weird padding, but keep the colors. Then
   use that for the default. The portal page (the main page of the site) and a few links scattered
   throughout can have the funky spacing, and the image, but ... the ones that are embedded
   everywhere in text won't, and they'll therefore look a bit better, and be easier to read.
   --------------------------------------------------------------------------------------
*/
a:link 
{
   color: #008000;
   font-size: 17px;
   text-decoration: underline;
}
a:visited 
{
   color: #734f3e;
   font-size: 17px;
   text-decoration: underline;
}
a:hover 
{
   color: #0054a6;
   font-size: 17px;
   text-decoration: underline;
}
a:active 
{
   color: #f22222;
   font-size: 17px;
   text-decoration: underline;
}
a.linkimage
{
   padding-left: 0px;
   padding-top: 0px;
   padding-right: 13px;
}
a.linkimage:link 
{
   color: #008000;
}
a.linkimage:visited 
{
   color: #734f3e; 
   background: url(https://heralds.westkingdom.org/links-background.gif) 100% 4px no-repeat;	  
}
a.linkimage:hover 
{
   color: #0054a6;
   background: url(https://heralds.westkingdom.org/links-background.gif) 100% -16px no-repeat;
}
a.linkimage:name 
{
    background: url(https://heralds.westkingdom.org/links-background.gif) 100% 130px no-repeat;
}	
a.linkimage:active 
{
   color: #f22222;
}
   
a.externalLink
{
   padding-left: 0px;
   padding-top: 0px;
   padding-right: 13px;
   background: url(https://heralds.westkingdom.org/external-link.gif) 100% 50% no-repeat;
   padding-right: 13px;
}

a.headinglink
{
   padding-bottom: 10px;
}
a.headinglink:link 
{
   color: #FFFFFF;
}
a.headinglink:visited 
{
   color: #CCCCCC; 
}
a.headinglink:hover 
{
   color: #FFFF00;
}

/*
   Need to leave default anchor with no definition because Bootstrap relies on
   anchor tags for all kinds of things (and underlines in weird places are not
   worth the effort), so instead we need a specific one for
   the site that has the text-decoration set to underline ... 
*/
a.ThisSite
{
   text-decoration: underline !important;
}

/* Copy of two-columns code for quick-links at top of main page */
 
div.quick_links /* The big division */
{
	text-align: left;
	width: 90%;
	display: inline-block;	/* for IE/Mac to contain its child elements */
	/* \*/ display: block;	/* override above rule for every other 
										  browser using IE/Mac backslash hack */
}
   
div.quick_links:after
{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
   
div.quick_links div.ql_left-column,
div.quick_links div.ql_right-column
{
	float: left;
	width: 50%;
}

div.quick_links div.ql_right-column
{
	margin-right: -3px;
	margin-left: -10px;	
}

div.quick_links div.ql_inside-column
{
	padding: 1px 5px;	/* 1px is there to get past a margin rendering
									 bug in Netscape 7 and older FireFox */
}
/* end of quick_links section */