html, body, div, span, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, a, article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section {
    /* Cancel out some differences between browser defaults */
    margin: 0px;
    padding: 0px;
    border: 0px;
    font: inherit;
    vertical-align: baseline;
    image-rendering: pixelated;
}

._hide{
    display: none !important;
    
}

/* Generic classes */

body{
    overflow:hidden;
}

#testbutton{
    position:absolute;
    left:10px;
    top:10px;

    width:120px;
    height:20px;

    background-color: red;
    color:white;

    z-index: 100;
}

.tile_containerm{
    position:relative;
    height:100px;
    width: 150px;
}

.tile_floorm{
    width:100px;
    height:100px;
    
    transform: rotateX(60deg) rotate(45deg);
    position:relative;
    left: 22px;
}

.tile_objectm{
    width: 200px;
    height: 200px;
    position: relative;
    top: -209px;
    left: -23px;

    filter:drop-shadow(3px 3px 3px rgb(0, 0, 0));

    background-repeat:no-repeat;
    background-position-x: 0px;
    background-position-y: 0px;

    background-size:200px;
    
}

.wall_l{
    transform: rotateX(60deg) rotate(45deg) rotateY(90deg) rotateZ(270deg);
    position:absolute;
}

.wall_m{
    position:absolute;
    
}

.wall_r{
    transform: rotateX(60deg) rotate(135deg) rotateY(90deg) rotateZ(270deg);
    position:absolute;
}

.floor{
    transform: rotateX(60deg) rotate(45deg);
    z-index: 0;

    position:absolute;
}

.garden_container{
    width:800px;
    height:600px;

    overflow:scroll;

    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.garden_container::-webkit-scrollbar {
  display: none;
}

.garden_content{
    position:relative;
    overflow:hidden;
}

#menu-placemode{
    width:800px;
    height:75px;

    position:relative;
    z-index:101;
    top:20px;

    pointer-events: none;
    
    background: #000000;
    background: linear-gradient(0deg,rgba(33, 33, 33, 0.3) 0%, rgba(76, 115, 9, 0) 100%);
    


    display:flex;
    flex-direction: row;
    align-items:start;
    justify-content: space-between;
}

#menu-placemode-infocontainer{
    height:70%;

    margin-left:100px;

    display:flex;
    flex-direction: row;
    align-items: center;
}

#menu-placemode-icon{
    width: 50px;
    height: 50px;

    position: relative;

    background-color: white;
    filter:drop-shadow(0px 0px 5px white);

    background-size: 500px 500px;

    animation-name: placemodeIconCircle;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}

@keyframes placemodeIconCircle{
    0%{top:2px;}
    50%{top:-2px}
    100%{top:2px;}
}

#menu-placemode-name{
    font-size:20px;
    font-weight: bold;
    color: rgb(0, 0, 0);
    margin-left:20px;
    filter:drop-shadow(1px 1px 1px white)
}

#menu-placemode-cancelbutton{
    width:75px;
    height:30px;

    margin-top:8px;
    margin-right:100px;

    background-color: rgba(226, 226, 226, 0.9);

    font-size: 21px;

    pointer-events:all;

    display:flex;
    align-items: center;
    justify-content: center;
}

#menu-placemode-cancelbutton:hover{
    background-color: rgba(209, 209, 209, 0.4);
}

/* Tile floor classes classes */

.tilestyle_pinkandgold{
    background-image:linear-gradient(0deg,rgba(255, 59, 199, 1) 0%, rgba(252, 234, 70, 1) 100%); 
}

.tilestyle_simplebrown{
    background-color:rgb(94, 68, 55);
}



/* Styling for test garden */

#garden-test-content{
    width:1000px;
    height:1000px;
    background: #03420b;
    background: linear-gradient(153deg,rgba(3, 66, 11, 1) 0%, rgba(87, 199, 133, 1) 50%, rgba(76, 115, 9, 1) 100%);
}

#floor-test{
    background-image: url(assets/textures/grass_test.png);
    background-size:200px;
    height: 2545px;
  width: 2806px;
  top: -646px;
  left: -905px;
}

#wall-test-l{
    background-image:url(assets/textures/bricks_test.png);
    background-size:100px;
    width:600px;
    height:400px;
    z-index: 5;

    left: -104px;
    top: -155px;
}


#wall-test-m{
    background-image:url(assets/textures/bricks_test.png);
    background-size:90px;
    width:550px;
    height:542px;
    z-index: 2;

    left: 228px;
     top: -427px;
}

#wall-test-r{
    background-image:url(assets/textures/bricks_test.png);
    background-size:100px;
    width:600px;
    height:400px;
    z-index: 5;

    left: 590px;
    top: -155px;
}



#tilecont-test1{
    left: 154px;
    top: 200px;

    z-index:51;
}

#tilecont-test2{
    left: 154px;
    top: 460px;

    z-index:52;
}

#tilecont-test3{
   left: 616px;
  top: -79px;
  z-index: 53;
}