.balloon1 {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 7px 10px;
min-width: 120px;
max-width: 100%;
color: #555;
font-size: 16px;
background: #e0edff;
}
.balloon1:before{
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #e0edff;
}
.balloon1 p {
margin: 0;
padding: 0;
}
.fa-white:before
{
color: #f0f8ff ;
}
.balloon3 {
position: relative;
display: inline-block;
margin: 1.5em 0;
padding: 0 5px;
width: 90px;
height: 90px;
line-height: 90px;
vertical-align: middle;
text-align: center;
color: #FFF;
font-size: 20px;
font-weight: bold;
background: #70a6ff;
border-radius: 50%;
box-sizing: border-box;
}
.balloon3:before{
content: "";
position: absolute;
bottom: -25px;
left: 50%;
margin-left: -15px;
border: 15px solid transparent;
border-top: 15px solid #70a6ff;
z-index: 0;
}
blockquote {
position: relative;
padding: 10px 20px;
box-sizing: border-box;
font-style: italic;
color: #4e4e4e;
background: #f2f9ff;
}
blockquote:before{
display: inline-block;
position: absolute;
top: 7px;
left: 10px;
vertical-align: middle;
content: "\f10d";
font-family: FontAwesome;
color: #d2e6ff;
font-size: 58px;
line-height: 1;
}
blockquote:after{
display: inline-block;
position: absolute;
bottom: 5px;
right: 15px;
vertical-align: middle;
text-align: center;
content: "\f10e";
font-family: FontAwesome;
color: #d2e6ff;
font-size: 40px;
line-height: 1;
}
blockquote p {
position: relative;
padding: 0;
margin: 10px 0;
z-index: 3;
line-height: 1.7;
}
blockquote cite {
position: relative;
z-index: 3;
display: block;
text-align: right;
color: #888888;
font-size: 0.9em;
} .sc { border: solid 2px #d5d5d5; background: #D8EDFF; color: #000000; } .sc:before { border: 12px solid transparent; border-right: 12px solid #d5d5d5; content: ""; } .sc:after { display: inline-block; position: absolute; border: 12px solid transparent; border-right: 12px solid #D8EDFF; content: ""; } .right .sc { background: #D8EDFF ; color: #000000; } .right .sc:before, .right .sc:after { right: -23px; left: auto; border: 12px solid transparent; border-left: 12px solid #d5d5d5; } .right .sc:after { right: -20px; border-left-color: #D8EDFF ; }