@charset "utf-8";

body {font-size: 9pt;}

.bg { position: absolute; top: 70px; left: 70px; z-index: 1; }
a {-moz-outline-style: none; }
.logo { position: absolute; top: 400px; left: 90px; z-index: 8; }


/*the navigation buttons location*/
#biography1    { position: absolute; top: 410px; left: 269px; z-index: 4; margin: 0; padding: 0;}
#illustration1 { position: absolute; top: 425px; left: 269px; z-index: 4; margin: 0; padding: 0;}
#drawing1       { position: absolute; top: 440px; left: 269px; z-index: 4; margin: 0; padding: 0; }
#resume1      { position: absolute; top: 455px; left: 269px; z-index: 4; margin: 0; padding: 0;}
#contact1         { position: absolute; top: 470px; left: 269px; z-index: 4; margin: 0; padding: 0;}

#biowriting { color: white; line-height: 14pt; width: 535px; z-index: 5; margin: 0;}
/*the "#resumewriting" below specifies resumewriting location*/
#resumewriting { color: white; line-height: 14pt; width: 515px; font-size: 1em; position: absolute; top: 335px; left: 483px; z-index: 5; margin: 0;}
#resumewriting1 { color: white; line-height: 14pt; width: 570px; font-size: 1em; position: absolute; top: 400px; left: 483px; z-index: 5; margin: 0;}
#resumewriting2 { color: white; line-height: 14pt; width: 570px; font-size: 1em; position: absolute; top: 540px; left: 483px; z-index: 5; margin: 0;}
/*the "p" below specifies biowriting location*/
p{ font-family: MS san serif, Helvetica, Arial, sans-serif; font-size: 1em; text-align: left; word-spacing: normal; position: absolute; margin: 0; top: 475px; left: 483px; z-index: 4; }

   
.blue{ color: #6aacff; }

.space{color: #1c1c1c;}

.skillcategory{color: #898989;}

/*the "#contactwriting" below specifies contactwriting location*/
#contactwriting { color: white; line-height: 14pt; width: 515px; font-size: 1em; position: absolute; top: 478px; left: 483px; z-index: 5; margin: 0;}

#visitblog {color: #898989; line-height: 12pt; width: 515px; font-size: 1em; position: absolute; top: 507px; left: 483px; z-index: 5; margin: 0; }

#visitblog a{text-decoration: none;}
#visitblog a:link{color: white;}
#visitblog a:visited{color: white;}
#visitblog a:hover{color: #6aacff;}

#visitpage {color: #898989; line-height: 12pt; width: 515px; font-size: 1em; position: absolute; top: 525px; left: 483px; z-index: 5; margin: 0; }

#visitpage a{text-decoration: none;}
#visitpage a:link{color: white;}
#visitpage a:visited{color: white;}
#visitpage a:hover{color: #6aacff;}

/*border of thumbnials*/
#marieantoinette1 img, #machinebird1 img, #untitled2 img, #checkerboard2 img, #crib3 img, #ameba3 img, #innerworld4 img, #dracula4 img, #relationship5 img, #yen5 img, 
#communication6 img, #yenandcity6 img, #moneyflood7 img, #hehe7 img, #di8 img, #ran9 img, #captain10 img, #mymother11 img,
#father12 img, #escape13 img, #kingandqueen14 img  { border-color: white; border-width: 1px;}

/*thumbnials locations*/
#marieantoinette1, #machinebird1 { position: absolute; top: 517px; left: 270px; z-index: 4; margin: 0; padding: 0; }

#untitled2, #checkerboard2       { position: absolute; top: 517px; left: 303px; z-index: 4; margin: 0; padding: 0; }

#crib3, #ameba3                  { position: absolute; top: 517px; left: 338px; z-index: 4; margin: 0; padding: 0; }

#innerworld4, #dracula4          { position: absolute; top: 517px; left: 372px; z-index: 4; margin: 0; padding: 0; }

#relationship5, #yen5            { position: absolute; top: 517px; left: 406px; z-index: 4; margin: 0; padding: 0; }

#communication6, #yenandcity6   { position: absolute; top: 517px; left: 440px; z-index: 4; margin: 0; padding: 0; }

#moneyflood7     { position: absolute; top: 551px; left: 270px; z-index: 4; margin: 0; padding: 0; }

#di8              { position: absolute; top: 551px; left: 303px; z-index: 4; margin: 0; padding: 0; }

#ran9             { position: absolute; top: 551px; left: 338px; z-index: 4; margin: 0; padding: 0; }

#captain10        { position: absolute; top: 551px; left: 372px; z-index: 4; margin: 0; padding: 0; }

#mymother11       { position: absolute; top: 551px; left: 406px; z-index: 4; margin: 0; padding: 0; }

#father12         { position: absolute; top: 551px; left: 440px; z-index: 4; margin: 0; padding: 0; }

#escape13, #hehe7         { position: absolute; top: 517px; left: 474px; z-index: 4; margin: 0; padding: 0; }

#kingandqueen14   { position: absolute; top: 551px; left: 474px; z-index: 4; margin: 0; padding: 0; }

/*location of notice of clicking thumbnials */
#clickthumbnail {position: absolute; top: 499px; left: 269px; z-index: 4; margin: 0; padding: 0; }

/*locations of real images*/
#marieantoinetteimage {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#machinebirdimage     {position: absolute; top: 195px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#untitledimage       {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#checkerboardimage   {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#cribimage           {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#amebaimage          {position: absolute; top: 195px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#innerworldimage     {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#draculaimage        {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#relationshipimage   {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#yenimage            {position: absolute; top: 195px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#communicationimage  {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#yenandcityimage     {position: absolute; top: 195px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#moneyfloodimage     {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}
#heheimage           {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#diimage             {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#ranimage            {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#captainimage           {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#mymotherimage       {position: absolute; top: 165px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#fatherimage         {position: absolute; top: 73px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#escapeimage         {position: absolute; top: 165px; left: 585px; z-index: 6; margin: 0; padding: 0;}

#kingandqueenimage         {position: absolute; top: 165px; left: 585px; z-index: 6; margin: 0; padding: 0;}

/*locations of image titles*/
.title {color: white; font-size: 1.1em; position: absolute; top: 587px; left: 269px; z-index: 4; margin: 0; padding: 0;}
.drawingtitle {color: white; font-size: 1.1em; position: absolute; top: 554px; left: 269px; z-index: 4; margin: 0; padding: 0;}

.credit { color: #a0a0a0; font-family: MS san serif, Helvetica, Arial, sans-serif; 
          font-size: .8em; text-align: center; word-spacing: normal; margin: 0; z-index: 4;
          text-transform: uppercase; position: absolute; top: 674px; left: 100px;}



#designmotiongraphics { position: absolute; top: 333px; left: 443px; z-index: 6;}