html{
    font-family: sans-serif;
}

body{
    margin: 20px;
    background-image: url("noty.png");
}

div{
    width: 40%;
    background-color: #f1adf7;
    padding-left: 30px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 20px;
    text-align: center;
    border: 1px solid black;
    border-radius: 10px;
    opacity: 0.7;
    box-shadow: 7px 7px 10px black;
}
div:hover{
    background-color: yellow;
    border: 3px solid red;
    opacity: 1;
    transform: rotate(15deg) scale(1,2);
    transition: 2s all;
}

hr {
    border: 0; height: 2; background: #d43f3f; box-shadow: 0 0 1px 1px #d43f3f;
}

td {
    text-align: center;
}

.myem {
    font-size: 2em;
    /*color: #d43f3f;*/
}

.clh1{
    color: green;
    
}

.clh1:hover{
    color: magenta;
}

#menu {
  position: fixed;
  left: 0;
  top: 80%;
  width: 8em;
  margin-top: -2.5em;
}

h2{
    color: blue;
}

.beforeafter{
    color: blue;
}

h2:before{
    content:"pered "
}