#main {
  width: 15em;
  color: #0000ff;
}
#main p {
  border-top-width: 2px;
  border-top-color: #fc0;
  border-left-width: 1px;
  border-left-color: #000;
  -moz-border-radius: 10px;
  border-style: dotted;
  border-width: 2px;
}
#main .cool {
  width: 100px;
}

#left {
  border-top-width: 2px;
  border-top-color: #fc0;
  border-left-width: 1px;
  border-left-color: #000;
  -moz-border-radius: 10px;
  font-size: 2em;
  font-weight: bold;
  float: left;
}

#right {
  border-top-width: 2px;
  border-top-color: #fc0;
  border-left-width: 1px;
  border-left-color: #000;
  -moz-border-radius: 10px;
  color: #f00;
  font-size: 20px;
  float: right;
}

.bordered {
  border-top-width: 2px;
  border-top-color: #fc0;
  border-left-width: 1px;
  border-left-color: #000;
  -moz-border-radius: 10px;
}

.complex {
  color: #f00;
  font-size: 20px;
  text-decoration: none;
}
.complex:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
* html .complex {
  height: 1px;
  color: #f00;
  font-size: 20px;
}

.more-complex {
  color: #f00;
  font-size: 20px;
  text-decoration: none;
  display: inline;
  -webkit-nonsense-top-right: 1px;
  -webkit-nonsense-bottom-left: 1px;
}
.more-complex:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
* html .more-complex {
  height: 1px;
  color: #f00;
  font-size: 20px;
}
.more-complex a:hover {
  text-decoration: underline;
  color: #f00;
  font-size: 20px;
  border-top-width: 2px;
  border-top-color: #fc0;
  border-left-width: 1px;
  border-left-color: #000;
  -moz-border-radius: 10px;
}