Box w/ Stich'n

Simple div box with a stiching outline border. All css

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Box w/ Stich'n</title>
  
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">

  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <div class="box">
  <h1>Box w/ Stichi'n</h1> 
  <p>...and some other text and stuff here.</p>
</div>
  
    <script  src="js/index.js"></script>

</body>
</html>
/* Downloaded from https://www.codeseek.co/ */
@import url(https://fonts.googleapis.com/css?family=Leckerli+One|Handlee);
html {
  background-color: #e95b33;
}

.box {
  position: relative;
  background-color: white;
  width: 400px;
  height: auto;
  margin: 40px auto;
  padding: 10px;
  -moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.2), 0 1px 1px rgba(0, 0, 0, 0.2), 0 3px 0 #fff, 0 4px 0 rgba(0, 0, 0, 0.2), 0 6px 0 #fff, 0 7px 0 rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.2), 0 1px 1px rgba(0, 0, 0, 0.2), 0 3px 0 #fff, 0 4px 0 rgba(0, 0, 0, 0.2), 0 6px 0 #fff, 0 7px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.2), 0 1px 1px rgba(0, 0, 0, 0.2), 0 3px 0 #fff, 0 4px 0 rgba(0, 0, 0, 0.2), 0 6px 0 #fff, 0 7px 0 rgba(0, 0, 0, 0.2);
}
.box:after {
  content: '';
  position: absolute;
  border: 2px dashed #ccc;
  top: 5px;
  bottom: 5px;
  left: 5px;
  right: 5px;
  -moz-box-shadow: 0 0 0 1px #fff;
  -webkit-box-shadow: 0 0 0 1px #fff;
  box-shadow: 0 0 0 1px #fff;
}
.box h1 {
  font-size: 3em;
  color: #2980B9;
  font-family: 'Leckerli One', cursive;
  text-align: center;
}
.box p {
  font-family: 'Handlee', cursive;
  text-align: center;
  font-size: 24px;
  color: #34495E;
}
/* Downloaded from https://www.codeseek.co/ */
// Forked from https://cssdeck.com/labs/full/fe1egt0a

This awesome code ( Box w/ Stich'n ) is write by Brad Bodine, you can se more from this user in the personal repository

You can find the original code on Codepen.io

2018 © Brad Bodine