body {
  background-color: #fffdd0;
font-family: sans-serif;
margin: 20px;
}

.box1 {
  border-width:2px;
  border-style:dashed;
  border-color:red;
  min-height:30px;
}

.box2 {
  min-height: 100px;
  width:300px;
  border-width:10px;
  border-left-style:dashed;
  border-left-color:red;
  border-right-style:dotted;
  border-right-color:black;
  border-top-style: double;
  border-top-color:purple;
  border-bottom-style: groove;
  border-bottom-color:orange;
}

.box3 {
  border-width:5px;
  border-style:solid;
  padding-left:10px;
  padding-right:50px;
  padding-top:20px;
  padding-bottom:100px;
  border-color:green;
}

.box4 {
  border-width:10px;
  margin-top:20px;
  margin-right:100px;
  margin-bottom:200px;
  margin-left:50px;
  border-style:solid;
  border-color:blue;
}

.floatbox1 {
  border:2px solid blue;
  height:300px;
  width:500px;
}


.floatbox2 {
  border:2px solid purple;
  height:300px;
  width:500px;
}

.floatbox3 {
  border:2px solid orange;
  height:300px;
  width:500px;
}

.floatbox4 {
  overflow:hidden;
  border:2px solid green;
  height:100px;
  width:800px;
}

.floatleft {float: left;}

.floatright {
  float:right;
}
.clear {
  clear:left;
}