@import url(http://fonts.lug.ustc.edu.cn/css?family=Patrick+Hand);
$sec:#002e2e;
$first:#fe6037; 
$clouds:#e7e2af;
*:before,*:after{
  position: absolute;
  content:"";
}
body{
  background:$sec;  
}
.stamp{
  position: relative;
  background:#fefffe;
  height:400px;
  width:350px;
  border-radius:40px;
  top:15%;
  left:35%;
  z-index:1;
}
.main{
  position: absolute;
  height:360px;
  width:310px;
  background:$first;
  border-radius:40px; 
  top:20px;
  left:20px;
  
  &:before{
    height:280px;
    width:44%;
    background:$first; 
    
    border-radius:0 50px 0 40px;
    z-index:5;
    bottom:0;
    left:0;
  }
&:after{
    border-radius:0 0 0 40px;
    height:90px;
    width:130px;
    bottom:0;
    left:0;
    z-index:40;
    background:linear-gradient(-45deg, $first 46%, $sec 0%);
  }
}
.house{
  background:$sec;
  height:90px;
  width:125px;
  position: absolute;
  top:50%;
  left:10%; 
  z-index:6;
  &:before{
width: 0;
height: 0;
border-style: solid;
border-width: 0 60px 45px 60px;
border-color: transparent transparent 
  $sec transparent;
top:-50%;
left:0;
  }
  &:after{
  background:$sec;
  height:90px;
  width:20px;
  top:-30%;
  left:84%; 
    border-radius:2px;
  }
}
.house-details{
  position: absolute;
  height:40px;
  width:15px;
  background:$first;
  top:232px;
  left:120px;
  z-index:30;
  border-radius:3px 3px 0 0;
  //To make that drop perfect -_- !!
  //Killed me!
  &:before{
    height:20px;
    width:20px;
    background:$clouds;
    border-radius: 100%;
    top:-120px;
    left:-100px;
  }
  &:after{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 10px 20px 10px;
    border-color: transparent transparent $clouds     transparent;
    top:-132.44px;
    left:-100px;
  }
}
.house-details2,.house-details2:before,.house-details2:after,.house-details3,.house-details3:before,.house-details3:after{
  height:15px;
  width:15px;
  border-radius:3px;
  background:$clouds;
  position: absolute;
  top:-00px;left:-35px;
  &:before{top:0px;left:-35px;}
  &:after{top:-35px;left:-35px;}
}
.house-details3,.house-details3:before,.house-details3:after{
  top:-35px;
  &:before{left:35px;top:0px;}
  &:after{border-radius:50%; top:-45px;left:-1px}
}
.clouds{
  height:40px;
  width:57%;
  position: absolute;
  top:0%;
  border-radius:70px 50px 50px 0;
  background:$clouds;
    &:before{
      background:$clouds;
      height:150px;
      top:50%;
      width:100px;
      }
  &:after{
     background:$clouds;
     height:40px;
     top:125%;
    left:30%;
     width:100px;
    border-radius:50px;
  }
}
.clouds2{
  height:200px;
  width:50%;
  position: absolute;
  top:20%;
  border-radius:10px 50px 50px 0;
  background:$clouds;
  &:before{
    height:10px;
    width:10px;
    background:$first;
    border-radius:10px 0 0 10px;
    top:-16%;
    left:60%;
  }
  &:after{
    height:10px;
    width:10px;
    background:$first;
    border-radius:50%;
    top:-16%;
    left:45%;
  }
}
.ground-trees{
  height:90px;
  width:183px;
  position: absolute;
  background:linear-gradient(58deg, $clouds 28%, $sec 0%);
  bottom:0;
  right:0;
  border-radius:2px 0 40px 0;
  z-index:41;
  &:before,&:after{
    background: $clouds;
    height:40px;
    width:5px;
    left:67px;
    top:-25px;
    border-radius:3px;
  }
  &:after{left:137px;}
  }
.another-ground-tree{
  position: absolute;
   background: $clouds;
    height:100px;
    width:5px;
    left:229px;
    top:185px;
    z-index:42;
    border-radius:3px;
  &:before,&:after{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20.5px 80px 20.5px; 
    border-color: transparent transparent $sec transparent;
    top:-10px;
    left:15px;
  }
  &:after{left:-51px}
}
.another-ground-tree-yo{
  height:50px;
  width:50px;
  position: absolute;
   top:-40px;
  left:-23px;
  background:$sec;
  border-radius:50%;
  &:before{
    top:55px;
    height:30px;
    width:30px;
    left:11px;
    background:$sec;
    border-radius:50%;}
}
.dastamp{
  position: absolute;
  height:80px;
  width:80px;
  background:$clouds;
  left:190px;
  border-radius:50%;
  top:10px;
  border:10px solid $sec;
  color:$sec;
  font-weight:bolder;
  font-size:50px;
  text-align:center;
  line-height:75px;
  font-family: 'Patrick Hand', cursive;
  z-index:100;
  &:before,&:after{
    height:8px;
    width:20px;
    background:$sec;
    border-radius:3px;
    top:10px;
    left:30px;
  }
  &:after{top:60px;}}

.dastamp2{
  position: absolute;
  height:8px;
  width:135px;
  background:$sec;
  border-radius:3px;
  top:55px;
  left:170px;
  z-index:1;
  &:before,&:after{
  height:8px;
  width:125px;
  background:$sec;
  border-radius:3px;
  top:-12px;
  left:5px;
  }
  &:after{
    top:12px;
  }
}

.salutation{
  font-size:50px;
  color:$first;
  text-shadow:2px 2px 0px $clouds;
  font-family: 'Patrick Hand', cursive;
}
a{
  opacity:0.7;
  &:hover{opacity:1;}
  text-decoration:none;
  color:$clouds;
  text-shadow:2px 2px 0px $first;
}