@charset "utf-8";

p.sample1 {
 border: 2px dotted red;
 padding: 10px;
 display: inline-block;
}

p.sample2 {
 border: 2px dotted red;
 padding: 10px 20px 30px 40px;
 display: inline-block;
}

div.sample3 {
 border: 2px dotted blue;
 width: 200px;
 margin: 10px 30px;
}

div.sample3 p { margin: 0;}

div.sample4 {
 border: 2px dotted blue;
 width: 200px;
 margin: 0 auto;
}

div.sample4 p { margin: 0;}

div.box01 {
 width: 150px;
 height: 150px;
 padding: 10px;
 border-color: orange;
 border-style: solid;
 border-top-width: 1px;
 border-right-width: 3px;
 border-bottom-width: 5px;
 border-left-width: 7px;
}

div.b-sample1 {
 border-top-style: solid;
 border-right-style: dotted;
 border-bottom-style: dashed;
 border-left-style: double;
 border-width: 5px;
 border-color: red;
 margin-right: 10px;
 width: 150px;
 height: 150px;
 display: inline-block;
}

div.b-sample2 {
 border-style: ridge;
 border-width: 5px;
 border-color: orange;
 margin-right: 10px;
 width: 150px;
 height: 150px;
 display: inline-block;
}

div.b-sample3 {
 border-style: inset;
 border-width: 5px;
 border-color: yellow;
 width: 150px;
 height: 150px;
 display: inline-block;
}

div.b-color1 {
 border-color: red green blue yellow;
 border-style: solid;
 border-width: 5px;
 width: 150px;
 height: 150px;
 padding: 10px;
}

div.border-sample {
 border: 5px dotted red;
 padding: 10px;
 width: 150px;
 height: 150px;
}

div.radius1 {
 border: 5px solid green;
 border-radius: 10px;
 margin-right: 10px;
 width: 150px;
 height: 150px;
 padding: 10px;
 display: inline-block;
}

div.radius2 {
 border: 5px solid orange;
 border-radius: 10px 20px 30px 40px;
 width: 150px;
 height: 150px;
 padding: 10px;
 display: inline-block;
}