/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}

.bedroom-wall {
  width: 100%;
  /*height: 100%;*/
  display: flex;
  align-items: center;
  justify-content: center; 
  background-color: #ebdda7;
  background-image: url("https://www.transparenttextures.com/patterns/egg-shell.png");
  /*background-size: cover;*/
  position: absolute;
  z-index: -1000;
  margin-left: 15%;
  margin-right: 15%;
}
.dresser-closed {
  margin-top: -5px;
  position: absolute;
  top: 70vh;
  margin-left: 15%;
  margin-right: 15%;
}
.bottom-shadow {
  filter: drop-shadow(20px #757575);
}
.mirror {
  position: absolute;
  top: -10vh;
  /*margin-left: 15%;*/
  /*margin-right: 15%;*/
}

.page-title {
  font-size: 10vw;
  font-variant: smallcaps;
  text-decoration: line-through solid #e54b4b 15%;
  text-align: center;
}

.unifrakturmaguntia-regular {
  font-family: "UnifrakturMaguntia", cursive;
  font-weight: 400;
  font-style: normal;
}

.woodshop {
    background-image: url("https://www.transparenttextures.com/patterns/purty-wood.png");
    background-color: #94a89a;
}

.tr_drawer_label {
  position: absolute;
  top: 135px;
  right: 85px;
  font-size: 5em;
  color: #ebdda7;
  filter: drop-shadow(0 0 0.75rem crimson);
}
.tl_drawer_label {
  position: absolute;
  top: 135px;
  left: 25px;
  font-size: 5em;
  color: #ebdda7;
  filter: drop-shadow(0 0 0.75rem crimson);
}

/*.drawer-label {*/
/*  position:relative;*/
/*  bottom:30px;*/
/*  left:0px;*/
/*  visibility:hidden;*/
/*}*/

area:hover .drawer-label {
  visibility:visible;
}

/*.mirror-frame {*/
/*  height: 400px;*/
/*  width: 800px;*/
/*  background-color: brown;  */
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center; */
/*  background-color: #6b3200;*/
/*  background-image: url("https://www.transparenttextures.com/patterns/purty-wood.png");*/
/*  border-radius: 70px 70px 0px 0px;*/
/*  box-shadow: inset 0.2em 0.2em 0.2em 0 rgba(255,255,255,0.5), inset -0.2em -0.2em 0.2em 0 rgba(0,0,0,0.5);*/
/*  margin: 100px;*/
/*}*/

/*.mirror-inner-frame {*/
/*  height: 300px;*/
/*  width: 700px;*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center; */
/*  border-radius: 70px 70px 0px 0px;*/
/*  border: 4px inset rgba(107,50,0,0.74);*/
/*  background-image: url("https://www.transparenttextures.com/patterns/purty-wood.png");*/
/*}*/

/*.mirror-glass {*/
/*  height: 300px;*/
/*  width: 700px;*/
/*  background: radial-gradient(circle, rgba(130,167,175,1) 0%, rgba(255,255,255,1) 100%);  */
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center; */
/*  border: 1px solid rgba(255,255,255,0.25);*/
/*  border-radius: 70px 70px 0px 0px;*/
/*}*/

/*.mirror-steam {*/
/*  height: 300px;*/
/*  width: 700px;*/
/*  display: flex;*/
/*  align-items: center;*/
/*  justify-content: center; */
/*  background: rgba(255,255,255,0.2);*/
/*  -webkit-backdrop-filter: blur(10px);*/
/*  backdrop-filter: blur(10px);*/
/*  border-radius: 70px 70px 0px 0px;*/
/*}*/

/*.dresser-bg {*/
/*   width: 800px; */
/*   height: 400px;*/
/*   display: flex; */
/*   justify-content: center; */
/*  background-image: url("https://www.transparenttextures.com/patterns/purty-wood.png");*/
/*  background-color: green;*/
/*}*/
/*.dresser-frame {
  background-image: url("https://www.transparenttextures.com/patterns/purty-wood.png");
  background-color: brown;
  clip-path: polygon(4% 17%, 4% 7%, 0 0, 100% 0, 96% 8%, 96% 18%, 96% 100%, 4% 100%);
}