


/* Special font specs*/
/* first for IE 4–8 */
@font-face {
  			font-family: FranklinGothicHandLight;
  			src: url("FranklinGothicHandLightWeb.eot");
			}
/* then for WOFF-capable browsers */
@font-face {
  			font-family: FranklinGothicHandLight;
  			src: url("FranklinGothicHandLightWeb.woff") format("woff");
			}			
/* first for IE 4–8 */
@font-face 	{
  			font-family: FranklinGothicHandDemi;
  			src: url("FranklinGothicHandDemiWeb.eot");
			}
/* then for WOFF-capable browsers */
@font-face {
  			font-family: FranklinGothicHandDemi;
  			src: url("FranklinGothicHandDemiWeb.woff") format("woff");
			}
/* first for IE 4–8 */
@font-face 	{
  			font-family: FranklinGothicHandBold;
  			src: url("FranklinGothicHandBoldWeb.eot");
			}
/* then for WOFF-capable browsers */
@font-face {
  			font-family: FranklinGothicHandBold;
  			src: url("FranklinGothicHandBoldWeb.woff") format("woff");
			}
				
/* General behavior specs */				
				

a:link 			{color: #000000;
				text-decoration:none;
				}

a:hover 		{color: #666666;
				text-decoration: none;          		
				}

a:active 		{color: #999999;
				}					

a:visited 		{color: #666666;
				text-decoration:none;
				}		
				


a.text:link 	{color: #000000;
				text-decoration:underline;
				}

a.text:hover {color: #666666;
				text-decoration: underline;          		
				}

a.text:active 	{color: #999999;
				}					

a.text:visited 		{color: #000000;
				text-decoration:underline;
				}		


img				{
				border: 0; 
				padding: 0;
				margin: auto;
				display: inline-block;
				}
				


/* Homepage layout specs */

body#home		{
				background-color: white;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 15px;
				font-weight: normal;
				color: Black;
				}       

#homepage		{
				display: block;
				border: 0; 
				padding: 0;
				margin: auto;
				width: 1000px;
				height: 720px;
				}
				
#homeimg		{
				display: block;
				border: 0; 
				padding: 0;
				margin: auto;
				}	
				
#homenav		{
				display: block;
				border: 0; 
				padding: 0;
				margin: auto;
				}
				
#homenavtop		{
				display: inline;
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 18px;
				font-weight: normal;
				letter-spacing: 1px;
				}
								
#homenavbottom	{
				display: block;
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 24px;
				font-weight: normal;
				letter-spacing: 1.5px;
				}				
				

				
#homenavline1	{
				display: inline;
				position:relative; top:-576px; left:813px;
				}			
				
#homenavline2	{
				display: inline;
				position:relative; top:-555px; left:698px;
				}					

#homenavabout	{
				display: inline;
				position:relative; top:-515px; left:520px;
				}
				
				
											
#homenavillust	{
				display: inline;
				position:relative; top:-318px; left:660px;
				}
				
#homenavfineart	{
				display: inline;
				position:relative; top:-279px; left:554px;
				}
								
#homenavdesign	{
				display: inline;
				position:relative; top:-241px; left:466px;
				}
				
#homenavmusic	{
				display: inline;
				position:relative; top:-200px; left:390px;
				}


/* Secondary pages overall and header layout specs */

/* Note on collapsing margins: be sure to put "px" after any specified values  */ 

body#secondary	{
				border: 0; 
				padding: 0;
				margin: auto;
				background-color: white;
				background-image: url(images_main/LalenaLab_background_img.jpg);
				background-position: center top;
				background-repeat: no-repeat;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 16px; 
				font-weight: normal;
				color: black;
				} 
				
#pagecontainer	{
				display: block; /* This keeps it centered  */ 
				border: 0; 
				padding: 0;
				margin: auto; /* This keeps it centered  */ 
				width: 1000px;
				position: relative;  /* This made the Next and Back buttons vertically-center  */ 
				}
		


#headerdiv		{
				display: inline-block;
				border: 0; 
				padding: 0;
				margin: 0;
				width: 960px;
				height: 220px;
				}
				
				
#logodiv		{
				display: inline-block;
				border: 0; 
				padding: 0;
				margin: 0;
				width: 550px;
				height: 220px;
				float: left;
				}
				
#navdiv			{
				display: inline-block;
				border: 0; 
				padding: 0;
				margin: 0;
				width: 410px;
				height: 220px;
				float: right;
				}
				
.headerlogoimg	{
				display: inline-block;
				border: 0; 
				padding: 0;
				margin: 0;
				}	
				
.headerruleimg	{
				display: inline-block;
				border: 0; 
				padding: 0;
				margin: 0;
				}	
				
#navcategories1	{
				display: inline-block;
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 106%; /* % of size set in {body} selector */    
				font-weight: normal;
				letter-spacing: 0.5px;
				overflow: visible;
				}				
				
#navcategories2	{
				display: inline-block;
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 93%; /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 0.5px;
				overflow: visible;
				}


/* Navigation for top row */

#navfineart		{
				display: inline-block;
				position:relative; top:100px; left:-166px;
				}
				
#navdesign		{
				display: inline-block;
				position:relative; top:100px; left:140px;
				}

#navillust		{
				display: inline-block;
				position:relative; top:100px; left:96px;
				}
				
#navmusic		{
				display: inline-block;
				position:relative; top:100px; left:120px;
				}

/* Navigation for bottom row */

#navname		{
				display: inline-block;
				position:relative; top:111px; left:-16px;
				}
				
#navhome		{
				display: inline-block;
				position:relative; top:111px; left:25px;
				}
								
#navabout		{
				display: inline-block;
				position:relative; top:111px; left:136px;
				}
				

				
								
/* Secondary pages content layout specs */    				  
#back			{
				display: inline-block;
				border: 0; 
				margin: 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 50%;
				left: 9%;
				}
				
#next			{
				display: inline-block;
				border: 0; 
				margin: 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 50%;
				right: 0;
				}
				
#backlower		{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 60%;
				left: 9%;
				}	
				
#nextlower		{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 60%;
				right: 0;
				}
				
#backhigher		{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 20%;
				left: 9%;
				}		
				
#nexthigher		{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 20%;
				right: 0;
				}	
				
#back_ill_des		{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 50%;
				left: 9%;
				}
				
#next_ill_des	{
				display: inline-block;
				border: 0; 
				margin: 120 10 10 10;
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsed-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				position: absolute;
				top: 50%;
				right: 0;
				}
				
#meat 			{
				border: 0; 
				padding: 0;
				margin: auto;
				position: relative; top:-10px; left:45px;
				width: 780px; height: auto;
				}
				
.table    		{ 
				display: table; /* This magically centered a row */ 
				border: 0; 
				padding: 0;
				margin: auto;
				text-align: center;
				width: 780px;
				}		
							
img.outlined	{
				border: 1px solid #999999;
				}
				
img.outlinedgray	{
					border: 1px solid #f0f0f0;
					}
							
img.stacked		{
				margin: 0 0 10px 0;
				}
				
				
.cell_ill		{
				display: inline-block;
				border: 0; 
				margin: auto;
				padding: 15px;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				}		
	
.centercontent	{
				border: 0; 
				padding: 0;
				display: block; 
				margin: auto;	
				}
				
.cell			{
				display: inline-block;
				border: 0; 
				margin: auto;
				padding: 5px;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				vertical-align: middle;
				}
	
/* Secondary pages typography specs  */ 

#meatWIDER 			{
				border: 0; 
				padding: 0;
				margin: auto;
				position: relative; top:-10px; left:75px;
				width: 960px; height: auto;
				}

	
h1				{
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 120%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 1px;
				position: relative; top:-33px; left:0px;
				&:hover {color: #666666; text-decoration:none; } 
				&:active {color: #999999; text-decoration:none;}			
				}	 /* DOUBLE BRACKETS ARE NOT AN ERROR! */ 	
				
h1.regspacing	{
				margin: 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 120%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 1px;
				position: relative; top:0px; left:0px;
				&:hover {color: #666666; text-decoration:none; } 
				&:active {color: #999999; text-decoration:none;}			
				}	 /* DOUBLE BRACKETS ARE NOT AN ERROR! */ 				
		
h1.h1_w_sub		{
				margin: 0 0 -40px 0;
				padding: 0;
				list-style-type: none; 
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 120%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 1px;
				position: relative; top:-33px; left:-30px;
				&:hover {color: #666666; text-decoration:none; } 
				&:active {color: #999999; text-decoration:none;}			
				}  /* DOUBLE BRACKETS ARE NOT AN ERROR! */ 
								
h2				{
				margin: 10px 0 20px -10;
				padding: 0;
				list-style-type: none; 
				color: black;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 3px;
				line-height: 140%;
				text-align: left;			
				}
				
h2.sections		{
				margin: 30px 0 20px 0;
				padding: 0;
				list-style-type: none; 
				color: black;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 3px;
				line-height: 140%;
				text-align: left;			
				}
				
h3				{
				margin: 20px 0 10px 0;
				padding: 0;
				list-style-type: none; 
				color: black;
				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 90%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 3px;
				line-height: 140%;
				text-align: left;			
				}
								
p				{/* See body#secondary */ 
				clear: both;
				margin: 0;
				padding; 0;
				line-height: 120%;
				}
				
p.alignleft		{/* See body#secondary */ 
				clear: both;
				margin: 0;
				padding; 0;
				line-height: 120%;
				text-align: left;
				}
				
				
p.centertext	{
				clear: both;
				text-align: center;
				margin-top: 0;
				margin-bottom: 15px;
				padding: 0;
				line-height: 120%;
				}
				
p.centertext_captions	
				{
				clear: both;
				text-align: center;
				margin-top: 0;
				margin-bottom: 0;
				padding: 0;
				line-height: 100%;
				}
				
p.resumelink	{
				clear: both;
				text-align: right;
				margin: -42px 0 10px 0;
				padding: 0;
				line-height: 100%;
				font-size: 93%;  /* % of size set in {body} selector */ 
				}
				
b 				{ 
  				font-family: FranklinGothicHandDemi,Arial,sans-serif;
				font-size: 100%;
				font-weight: normal;
   				font-style: normal;
				}
				
b.extra 		{ 
  				font-family: FranklinGothicHandBold,Arial,sans-serif;
				font-size: 100%;
				font-weight: normal;
   				font-style: normal;
				}	
				
div.details  	{ 
				/* COLLAPSING MARGIN PROBLEM ON FIREFOX; happens sometimes when div is inside a div */
				display: table; /* This magically centered a row */ 
				text-align: left;
				width: 780px;		
				display: inline-block; /* This let the L-alignment on text to work */
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 90%; 
				font-weight: normal;
				line-height: 90%;
				box-sizing: border-box;  
				/* This sometimes overrides collapsing-margins/padding phenomenon of some browsers */ 
				padding: 10px 0 10px 0;
				margin: auto;
				}
						
							
/* ABOUT  */ 
	
.about_Lcolumn	{
				display: inline;
				border: 0; 
				margin: auto;
				padding: 0 25px 0 0;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				width: 315px;
				float: left;
				}
				
.about_Rcolumn	{
				display: inline;
				border: 0; 
				margin: auto;
				padding: 0;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				width: 450px;
				float: right;
				}		
				
img.about		{
				display: inline;
				border: 0; 
				margin: auto;
				padding: 0;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				float: right;
				}
				
 p.about		{
				display: inline-block; /* This let the L-alignment on text to work */ 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%; 
				font-weight: normal;
				line-height: 130%;
				text-align: left;			
				}
				
				
 p.event		{
				display: inline-block; /* This let the L-alignment on text to work */ 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%; 
				font-weight: normal;
				line-height: 130%;
				text-align: left;
				margin-top: 1em;			
				}
				
h2.about			{
				margin: 15px 0 5px 0;
				padding: 0;
				list-style-type: none; 
				color: black;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 3px;
				line-height: 140%;
				text-align: left;			
				}
	/* the next one is just for the word ABOUT   */ 			
span.colheading 	{
				display: inline;
				color: black;
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 100%;  /* % of size set in {body} selector */ 
				font-weight: normal;
				letter-spacing: 3px;
				line-height: 200%;
				text-align: left;		
				}



/* FINE ART  */ 
		/* These justified items are for the main page with thumbnails  */ 		
.tablejustify   { 
				display: table; 
				border: 0; 
				padding: 0;
				margin: auto;
				width: 780px;
				}				
				
.rowjustify     { 
 				display: flex;  /* Flexbox allows horizontal distribution of items  */ 
 				flex-direction: row;
 				border: 0;
 				text-align: justify;
 				margin: 0;    
 				padding: 10px 0 10px 0;
 				justify-content: space-between;   				
 				align-items: center;	/* Vertical alignment in a flexbox  */ 
				}	
				
.rowjustify2     { 
 				display: flex;  /* Flexbox allows horizontal distribution of items  */ 
 				flex-direction: row;
 				border: 0;
 				text-align: justify;
 				margin: 0;    
 				padding:0 0 20px 0;
 				justify-content: space-between;   				
 				align-items: baseline;	/* Vertical alignment in a flexbox  */ 
				}			

.celljustify    {   
 				display: inline-block;  
 				border: 0;
 				margin: 0;    
 				padding: 0;
				}

div.fineart_details  	{ 
				display: table; /* This magically centered a row */ 
				border: 0; 
				padding: 0;
				margin: auto;
				text-align: left;
				width: 780px;
				}


 p.fineart_details		{
						display: inline-block; /* This let the L-alignment on text to work */ 
						font-family: FranklinGothicHandLight,Arial,sans-serif;
						font-size: 90%; 
						font-weight: normal;
						line-height: 115%;
						text-align: left;
						margin: 2 0 0 0;
						}



						
/* BOOKS  */ 
/* Note that the <img> for text to be wrapped around goes inside the <p> tag  */ 
				
.books_Lcolumn	{
				display: inline;
				border: 0; 
				margin: auto;
				padding: 0 15px 0 0;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				width: 400px; /* Table is 780 */ 
				float: left;
				}
				

.books_Rcolumn	{
				display: inline;
				border: 0; 
				margin: auto;
				padding: 0 0 0 15px;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				width: 380px; /* Table is 780 */ 
				float: right;
				}
				
.img_Lcolumn	{
				display: inline;
				border: 0; 
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				float: left;
				}
				

.img_Rcolumn	{
				display: inline;
				border: 0; 
				padding: 0;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				float: right;
				}
				
.books_minirow	{
				display: inline-block;
				border: 0; 
				margin: auto;
				padding: 0 0 20px 0;
				box-sizing: border-box;  
				/* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				}	
				
				
img.books_cell	{
				display: inline;
				border: 0; 
				margin: 0 10px 10px 0;
				padding: 0;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				float: left;
				}

				
img.book_Lcol	{
				display: inline;
				border: 0; 
				margin: 0 20px 10px 0;
				padding: 0;
				box-sizing: border-box;  /* This overrides collapsing-margins/padding phenomenon of some browsers */ 
				float: left;
				}				
								
p.small			{
				display: inline-block; /* This let the L-alignment on text to work */ 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 90%; 
				font-weight: normal;
				line-height: 110%;
				text-align: left;			
				}
				
				
span.booktitle {
				display: inline;
				font-family: FranklinGothicHandBold,Arial,sans-serif;
				font-size: 100%; 
				font-weight: normal;
				line-height: 130%;
				text-align: left;		
				font-style:oblique;	
				}

span.quotecredit	{
				display: inline-block; /* This let the L-alignment on text to work */ 
				font-family: FranklinGothicHandLight,Arial,sans-serif;
				font-size: 90%; 
				font-weight: normal;
				line-height: 110%;
				text-align: left;			
				}
				

/* ALL DETAIL PAGES specs  */ 
/* Note that the <img> for text to be wrapped around goes inside the <p> tag  */ 
/* Table is 780 */ 
			
