/* Body layout */
body {  margin: 0; font-family: "Comic Sans MS", "Verdana", sans-serif; display: flex;  background-color: #111;  color: #fff;}

/* Sidebar */
.sidebar { width: 200px; background-color: #330022;  padding: 20px;  box-shadow: 2px 0px 10px #ff3399; height: 100vh;}

.sidebar h2 {  color: #ffcc00; text-shadow: 1px 1px #000;  font-size: 20px;}

.sidebar a {  display: block; color: #00ffff;  text-decoration: none;  margin: 10px 0;}
.sidebar a:hover { color: #ff3399;}

/* Main content */
.main {flex: 1; padding: 20px;}

/* Welcome box */
.welcome-box {background-color: #660033; border: 3px solid #ff3399; padding: 15px;margin: 20px 0;text-align: center; color: #fffff
; box-shadow: 0px 0px 10px #ff3399;}

.welcome-box h1 {  color: #ffcc00; text-shadow: 2px 2px #000000;  font-size: 24px;}

.welcome-box .note { font-style: italic;  color: #00ffff;}
   
  .paint-box { position: relative; display: inline-block;  margin: 20px auto;}

.paint-window { width: 500px; /* adjust size */  display: block;}

.face-overlay { position: absolute;  top: 55px; left: 80px; width:400px }
