<style type="text/css">

<!--- white space with lightbox style sheet for www.jennyfilipetti.com --->

html{
}

body{
   height: 100%;
   width: 100%;
}

@font-face{
   font-family: "Stitch Title";
   src: url('https://jennyfilipetti.com/languagetapestries/src/fonts/StitchTitle.ttf');
}

@font-face {
   font-family: "Adobe Caslon Pro Bold";
   src: url('https://jennyfilipetti.com/languagetapestries/src/fonts/ACaslonPro-Bold.otf');
}

@font-face{
   font-family: "Adobe Caslon Pro Regular";
   src: url('https://jennyfilipetti.com/languagetapestries/src/fonts/ACaslonPro-Regular.otf');
}

@font-face{
   font-family: "Cambria";
   src: url('https://jennyfilipetti.com/languagetapestries/src/fonts/Cambria.ttf');
}

img.homepage{
   max-width:80%; 
   max-height:80%;
}

a{
   text-decoration: none;
   font-variant:small-caps;
   color: #c21858;
   font-size: 12pt;
}

a#menubar{
   color: black;
}

#header{
   display:block;
   margin-top:40px;
}

/*
div#header{
   margin-left: 15%;
   display: block;
   text-align: left;
}

div#subheader{
position: absolute;
top: 20px;
right: 30%;
vertical-align:middle;
}
*/

h1 {
   padding: 0px 0px;
   font-family: "Adobe Caslon Pro Regular", "Times New Roman", serif;
   font-size: 26pt;
   display: inline;
   line-height: 18pt;
}

h1#sh{
font-family: "Stitch Title", sans-serif;
font-size: 42px;
text-align: center;
display: block;
line-height:50px;
}

h1#t1{
   letter-spacing:0px;
   font-stretch: expanded;
}

h1#t2{
   font-size: 10pt;
   padding: 0px 2px 0px 0px;
}

h1#t3{
   font-size: 16pt;
}

h2{
   font-family: "Cambria", "Arial", sans-serif;
   font-weight: normal;
   font-size: 10pt;
   display: inline;
   line-height: 10pt;
}

p{
   font-family: "Cambria", "Arial", sans-serif;
   font-weight: normal;
   font-size: 12pt;
   display: block;
   text-align: justify;

   margin: 0px 10% 0px 10%;  <!-- orig 20% left/right 40px top/bottom -->
}


div#container{
   position: absolute;
   width: 100%;
   height: 80%;
   min-height: 80%;
   max-height: 80%;
}



div#page{
   position: absolute;
   width: 70%;
   height: auto;
   max-height: 80%;
   min-height: 20%;
   margin-bottom:30px;
   margin-left: 15%;
   margin-right: 15%;
}

div#menubar{
   clear:both;
   margin-left: auto;
   margin-right: auto;
   text-align: center;
   position: absolute;
   bottom: 0px;
   width: 100%;
   height: 20px;
}

div#projectcontainer{
  background: white;
   min-width: 450px;
   max-width: 100%; 
   margin-left: auto;
   margin-right: auto;
   display: block;
}

div.projectthumb{
   width: 200px;
   height: 200px;
   padding: 5px 5px;
   margin: 15px 5px 15px 5px;
   
   text-align: center;
   display: block;
   float: left;
}

.projectthumb img{
      margin-bottom: 6px;
}

#projectcontainer .projectthumb a,
#projectcontainer .projectthumb p, #infotab a{
   font-family: sans-serif;
   font-weight:600;
   font-size: 10pt;
}

ul{
   display: block;
}



li#menubar{
   font-family: "Adobe Caslon Pro Regular", "Times New Roman", serif;
   font-size: 12pt;
   padding: 0px 20px;
   display: inline;
}


p#infotab{
position:static;
font-size: 12pt;
margin: 0px 35px 15px 0px;
padding: 0px;
text-align: right;
}

p#projectinfo{
font-size: 12pt;
position:static;
margin-left: auto;
margin-right: auto;
margin: 0px 0px 0px 0px;
padding: 10px 0px 30px 0px;
z-index: 10;
display: none;
}

/* Lightbox code based on: http://schier.co/post/creating-pure-css-lightboxes-with-the-:target-selector */

.lightbox {
  display: none;
  position: fixed;
  z-index: 20;
  text-align: center;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255,0.8);
  // (0,0,0,0.9)
}

.lightbox img {
  max-width: 90%;
  max-height: 80%;
  margin-top: 3%;
}


.lightbox p{
  text-align: center;
  color: black;
  //color: white;
  font-size: 14pt;
}

.lightbox:target {
  display: block;
  outline: none;
}

</style>