body{
	margin:0 50px 50px; 50px;;
}

div.test{
	margin:50px;
}

div.test h3.c1 {
	display: inline;
	border-style: dotted none none none;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

div.test h3.c2 {
	display: inline;
	border-style: dotted none dotted none;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

div.test h3.c3 {
	display: inline;
	border-style: dotted dotted dotted dotted;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

div.test h3.c4 {
	display: inline;
	border-style: none dotted none dotted;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}


div.test h3.c5 {
	display: inline;
	border-style: none none none dotted;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}


div.test h3.c6 {
	display: inline;
	border-style: none dotted none none;
	border-width: 5px;
	border-color: #eee;
	font-size: 1.2em;
	position: relative;
	padding: 5px 10px;
	margin: 1em 0 3em;
	color: #fff;
	background: #5fadfc;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#97c8fb), to(#5fadfc));
	background: -moz-linear-gradient(#2e88c4, #075698);
	background: -o-linear-gradient(#2e88c4, #075698);
	background: linear-gradient(#2e88c4, #075698);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

div.test h3.c7 {
  position: relative;
  color: #111;
  background: #fff;
  font-size: 20px;
  border-bottom :2px solid #555;
  margin: 30px -10px 10px -10px;
  padding: 15px 5px 12px 10px;
  border-radius: 3px;
}
div.test h3.c7:after,div.test h3.c7:before {
  content: "";
  position: absolute;
  top: 100%;
  height: 0;
  width: 0;
}
div.test h3.c7:after {
  left: 33px;
  border: 11px solid transparent;
  border-top: 11px solid #fff;
}
div.test h3.c7:before {
  left: 30px;
  border: 14px solid transparent;
  border-top: 14px solid #555;
}



div.test h3.c8 {
	letter-spacing:8px;
  position: relative;
  color: #111;
  background: #fff;
  font-size: 20px;
  border-bottom :1px solid #aaa;
  margin: 30px -10px 0px -10px;
  padding: 15px 5px 10px 5px;
  border-radius: 3px;
}
div.test h3.c8:after,div.test h3.c8:before {
  content: "";
  position: absolute;
  top: 100%;
  height: 0;
  width: 0;
}
div.test h3.c8:after {
  left: 31px;
  border: 11px solid transparent;
  border-top: 11px solid #fff;
}
div.test h3.c8:before {
  left: 30px;
  border: 12px solid transparent;
  border-top: 12px solid #aaa;
}

div.test h3.c9 {
  position: relative;
  color: #111;
  background: #fff;
  font-size: 20px;
  border-bottom :1px solid #aaa;
  margin: 30px 0px 0px 0px;
  padding: 12px 5px 10px 12px;
  border-radius: 3px;
	border-left-width: 10px;
	border-left-color: #5fadfc;
	border-left-style: solid;
	letter-spacing: 8px;
	height: auto;
	vertical-align: middle;
	}	
div.test h3.c9:after,div.test h3.c9:before {
  content: "";
  position: absolute;
  top: 100%;
  height: 0;
  width: 0;
}
div.test h3.c9:after {
  left: 31px;
  border: 11px solid transparent;
  border-top: 11px solid #fff;
}
div.test h3.c9:before {
  left: 30px;
  border: 12px solid transparent;
  border-top: 12px solid #aaa;
}