/* 30 Dec 2011 changed background color from f6f0fa to fbf5ff */
/* 10 May 2016 changed background color to white ffffff */
body {background-color: #ffffff} 

a.nav:link    {font-style: italic; color: #6C606C; font-family: "Arial Narrow", Arial; line-height: 2.0; font-weight: 400; text-decoration: none;}
a.nav:visited {font-style: italic; color: #6C606C; font-family: "Arial Narrow", Arial; line-height: 2.0; text-decoration: none;}
a.nav:active  {font-style: italic; color: #6C606C; font-family: "Arial Narrow", Arial; line-height: 2.0; text-decoration: none;}
a.nav:hover  {font-style: italic; color: #FF005D; font-family: "Arial Narrow", Arial; line-height: 2.0; text-decoration: none;}

a.itm:link
a.itm:visited
a.itm:active
a.itm:hover

/*Fonts */
p {color: #28040E; font-family: Verdana, Arial;}
p.nav-title {color: #6C606C;; font-weight: 600; font-family: "Arial Narrow", Arial;}
p.index {color: #fbf5ff; font-family: Verdana, Arial;} 
p.index-nav-title {color: #fbf5ff; font-weight: bold; font-family: "Arial Narrow", Arial;}
p.section {color: #28040E; font-family: Verdana, Arial; font-size: 1.2em;}
p.desc {color: #28040E; font-family: Verdana, Arial; font-size: .8em; line-height: 2.0}
p.desci {color: #fbf5ff; font-family: Verdana,  Arial; font-size: .8em; line-height: 2.0}
/* added 17 July 2025 */
ul {color: #28040E; font-family: Verdana, Arial;}
li {color: #28040E; font-family: Verdana, Arial;}

/* 29 June 2014 removed font-weight: 600; from h3 and changed color from #6c606c to #28040e */
h1 {color: #129612; font-family: "Parisian BT", Arial; font-size: 2em; line-height: 1.2}
h1.indx {color: #fbf5ff; font-family: "Parisian BT", Arial; font-size: 2em; line-height: 1.2}
h2 {color: #28040E; font-family: "Parisian BT", Arial; font-size: 1.5em; line-height: 1.2}
h3 {color: #28040e; font-family: "Parisian BT", Arial; font-size: 1em; margin-bottom: -3; margin-left: 2em;}
h3.indx {color: #fbf5ff; font-family: "Parisian BT", Arial; font-size: 1em; margin-bottom: -3 margin-left: 2em;}

/* trying to get 3 images across the page */
/* Three image containers (use 25% for four, and 50% for two, etc) */
.column {
  float: left;
  width: 33.33%;
  padding: 5px;
}

/* Clear floats after image containers */
.row::after {
  content: "";
  clear: both;
  display: table;
}
/* end 3 images across code */ 
/* 15 July 2025 - I think if the images are too wide, they don't spread out properly. I will have to look into this further because the rightmost images all pop down to the next line. */

/* Structure - Containers - Liquid */
/* viewport allows for padding (90%) and centered margins with 10 pixel padding at top and bottom */
/* Background color and possibly increased line-height (space between lines) */
/* background color changed to white 10 May 2016 */
#container
{
/* width: 90%; */
width: 100%;
margin: 10px auto; 
background-color: #ffffff;
line-height: 130%;
}

#containeri
{
width: 90%;
margin: 10px auto; 
background-color: #24080E;
line-height: 130%;
}

/* Header - Banner will need to add banner-logo image */
/* changed banner height to 120 because new banner is 115 pixels high */
#banner
{padding: .5em;
height: 120px;
background-image: url(images/vener-art-banner2016.png);
background-repeat: no-repeat;
}

/* Top NavBar */
#navbar
{float: center; width: 100%;
margin: 0;
padding: .5em;
border-top: 1px solid #24080E;
}


/* workaround so all browsers have bottom border under navbar */
#line {float: center; width: 100%; margin: 0; border-top: 1px solid #24080E;}

/* creating horizontal nav bar from unordered list with indent for text */
#navbar ul
{
	margin: 0; margin-left: 10%;
	padding: 0;
}

#navbar ul li
{
	list-style-type: none;
	display: inline;
}

/* Getting the display to shift the links equidistant */
#navbar li a
{
	display: inline-block; width: 15%;
	float: left; 
	padding: 5px 0px;
	font-style: italic; color: #6C606C; font-family: "Arial Narrow", Arial;
	text-decoration: none;
}

#navbar li a:hover {font-style: italic; color: #FF005D; font-family: "Arial Narrow", Arial;}


/* Top NavBar for index.html */
#navbari
{float: center; width: 100%;
margin: 0;
padding: .5em;
border-top: 1px solid #fbf5ff;
}

/* creating horizontal nav bar for index.html from unordered list */
#navbari ul
{
	margin: 0; margin-left: 10%;
	padding: 0;
}

#navbari ul li
{
	list-style-type: none;
	display: inline;
}

 /*temporary width change from 20% 27 Feb 2022 */
#navbari li a
{
	display: inline-block; width: 20%;   
	float: left;
	padding: 5px 0px;
	font-style: italic; color: #FBF5FF; font-family: "Arial Narrow", Arial; 
        text-decoration: none;
}

#navbari li a:hover {font-style: italic; color: #FF74C5; font-family: "Arial Narrow", Arial;}

/* Main */
/* in case using h1 coding here, need to lose included h1 padding and not have drop float (1 em padding is max) */
#main
{
margin: 0
clear: left; float: right; width: 80%;
padding: 1em;
}

/* commented out 17 July 2025, this is what gives area for drop down menu in vener-art.com */
/* #main h1
{
padding: 0;
margin: 0;
margin-left: 200px;
} */

/* Remove space above content in main box */
#main h2 { margin: 0 0 .5em 0; }
#main p { margin: 0 0 .5em 0; }
p {color: #24080e; font-family: Arial; line-height: 1.5; padding-bottom: .5em; text-align: justify;}
.floatleft {float: left; padding: 0 10px 5px 0;}
.floatright {float: right; padding: 0 0 5px 10px;}
#main a {font-family: Tahoma; color:#9669ff;}
#main a:hover {font-style: italic; color: #FF74C5;}
p.indent {padding: 0 7.5em;}

/* code so as to be able to align 3 images in a row */
/* added 30 December 2022 */
<style>
* {
  box-sizing: border-box;
}

.column {
  float: left;
  width: 33.33%;
  padding: 5px;
}

/* Clearfix (clear floats) */
.row::after {
  content: "";
  clear: both;
  display: table;
}
</style>
/*end align 3 images in a row */

/* Footer clear: both command ensures footer is below everything but it's not working*/

#footer
{
clear: both; 
position: fixed; /*added 17 Jan 2023 */
bottom: 0; /*added 17 Jan 2023 */
left: 0; /*added 17 Jan 2023 */
margin: 0;
padding: .5em;  
border-top: 1px solid #24080E;
}

/*footer navbar */
/* creating footer horizontal nav bar from unordered list */
#footer ul
{
	margin: 0;
	padding: 0;
}

#footer ul li
{
	list-style-type: none;
	display: inline;
}

#footer li a
{
	display: block;
	float: left;
	padding: 5px 10px;
        font-style: italic; color: #6C606C; font-family: "Arial", Tahoma, Arial; font-size: .7em;
        text-decoration: none;
}

#footer li a:hover {font-style: italic; color: #FF005D; font-family: "Arial", Arial; font-size: .7em;}
#footer ul li.right {float: right; list-style-type: none; display: inline;}
#footer li a.right 
{
	display: block;
	float: right;
	padding: 5px 10px;
        font-style: italic; color: #6C606C; font-family: "Arial", Arial; font-size: .7em;
}

/* index.html footer */
/* do I need to change 1 pixel line to ffffff? */
#footeri
{
clear: both;
margin: 0;
padding: .5em;
border-top: 1px solid #fbf5ff;
}

/* index.html footer navbar */
/* creating index.html footer horizontal nav bar from unordered list */
#footeri ul
{
	margin: 0;
	padding: 0;
}

#footeri ul li
{
	list-style-type: none;
	display: inline;
}

#footeri li a
{
	display: block;
	float: left;
	padding: 5px 10px;
	font-style: italic; color: #fbf5ff; font-family: "Arial", Tahoma, Arial; font-size: .7em;
	text-decoration: none;
}

#footeri li a:hover {font-style: italic; color: #FF74C5; font-family: "Arial", Arial; font-size: .7em;}
#footeri ul li.right {float: right; list-style-type: none; display: inline;}
#footeri li a.right 
{
	display: block;
	float: right;
	padding: 5px 10px;
        font-style: italic; color: #fbf5ff; font-family: "Arial", Arial; font-size: .7em;
}

