/* 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." */
.flower_girl
{
  position: absolute;
    width: 100px;
  height: 130px;
  top:  0;
  left: 0;
}

.flower_girl img
{
  top: 0;
  right: 0;
  width: 100px;
  height: 130px;
  object-fit: fill;
}


body {
  background-color: purple;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-attachment: fixed; 
  background-image:  linear-gradient(rgba(255, 0, 255, 0.5), rgba(0, 0, 128, 0.5)), url("/purple_background.png");
  color: black;
  font-family: Verdana;
}

.Box_top
{
  border: 7px dotted pink;
  background-color: purple;
  width: 700px;
  height: 250px;
  margin: auto;
}
.Title_Gif
{
  transform: scale(2);
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 35%;
  height: auto;
  object-fit: cover;
}

.Box_middle
{
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: purple;
  width: 700px;
  height: 500px;
  margin: auto;
  margin-top: -250px;
    border-width: 10px ;
    border-style: solid;
    border-image: url("https://img-fotki.yandex.ru/get/4602/28257045.844/0_7d5c6_2de543e9_XXXL") 35 round; 
    border-radius:15px;
}

.Inner_Box1
{
  background-color: pink;
  color: white;
  width: 650px;
  height: 100px;
  margin: auto;
  margin-top: 20px;
  border: 9px double purple;
}
.Inner_Box2
{
  background-color: pink;
  flex-direction: row;
  display: inline-block;
  color: white;
  width: 650px;
  height: 200px;
  margin: auto;
  margin-top: 20px;
  border: 9px double purple;


}
.Inner_Box2 img{
margin-left:10px;

}
.Inner_Box2 p{
margin-left:10px;
}

.Unity
{
    margin: auto;
    top: 0;
    width: 100px;
    height: 100px;
    padding: 10px;
}

.blender
{
    margin: auto;
    top: 0;
    width: 100px;
    height: 100px;
     padding: 10px;
}
.Unreal
{
    margin: auto;
    top: 0;
    width: 100px;
    height: 100px;
    padding: 10px;
}

.Aseprite
{
    margin: auto;
    top: 0;
    width: 100px;
    height: 100px;
    padding: 10px;
}

.Inner_Box3
{
  background-color: pink;
  color: white;
  width: 650px;
  height: 200px;
  margin: auto;
  margin-top: 20px;
  border: 9px double purple;
}

.Panel_Test
{
  width: 320px;
  height: 40px;
  position: absolute;
  right: 70px;
  color: black;
  padding: 5px;
  margin-top: -80px;
  
   border-width: 7px;
   border-style: solid; 
   border-image: url("https://i.imgur.com/NJa4bp2.png") 8 fill round; 
  


}
.List1
{
  width: 200px;
  height: 220px;
border-width: 7px; 
border-style: solid; 
border-image: url("https://i.imgur.com/ROjUrNz.gif") 6 fill round; 
  


}
.Olm_Girl
{
  
  position: absolute;
  right: 0px;
}

.FISH
{
  margin: auto;
  width: 320px;
  height: auto;
}