﻿st-speech-balloon-left {
	position: relative;
}

	st-speech-balloon-left .circle1 {
		position: absolute;
		width: 350px;
		height: 350px;
		border-radius: 50%;
		background-color: white;
		left: 10px;
		top: -10px;
		z-index: 0;
	}

	st-speech-balloon-left .circle2 {
		position: relative;
		padding: 1rem;
		width: 350px;
		height: 350px;
		border-radius: 50%;
		border: 1px solid #7E7E7E;
		color: black;
		background-color: transparent;
		z-index: 1;
	}

		st-speech-balloon-left .circle2:before {
			position: absolute;
			top: 80%;
			left: 4%;
			width: 50px;
			border-top: 8px solid #FFF5A7;
			transform: rotate(50deg);
			content: "";
			z-index: 2;
		}

		st-speech-balloon-left .circle2:after {
			position: absolute;
			top: 83%;
			left: 6%;
			transform: rotate(45deg);
			height: 35px;
			width: 1px;
			background-color: #7E7E7E;
			content: "";
			z-index: 3;
		}

		st-speech-balloon-left .circle2 .center-element {
			margin: 0;
			padding: 2rem 2rem 2rem 1rem;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			color: #7E7E7E;
		}

		st-speech-balloon-left .circle2 .center-element p{
			line-height:2rem;
		}

st-speech-balloon-right {
	position: relative;
	margin-top: 0rem;
	margin-left: 10rem;
}

	st-speech-balloon-right .circle1 {
		position: absolute;
		width: 350px;
		height: 350px;
		border-radius: 50%;
		background-color: white;
		left: -10px;
		top: -10px;
		z-index: 0;
	}

	st-speech-balloon-right .circle2 {
		position: relative;
		padding: 1rem;
		width: 350px;
		height: 350px;
		border-radius: 50%;
		border: 1px solid #7E7E7E;
		color: black;
		background-color: transparent;
		z-index: 1;
	}

		st-speech-balloon-right .circle2:before {
			position: absolute;
			top: 80%;
			left: 82%;
			width: 50px;
			border-top: 8px solid #FFF5A7;
			transform: rotate(-50deg);
			content: "";
			z-index: 2;
		}

		st-speech-balloon-right .circle2:after {
			position: absolute;
			top: 82%;
			left: 94%;
			transform: rotate(-45deg);
			height: 35px;
			width: 1px;
			background-color: #7E7E7E;
			content: "";
			z-index: 3;
		}

		st-speech-balloon-right .circle2 .center-element {
			margin: 0;
			padding: 2rem 3rem 2rem 1rem;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			color: #7E7E7E;
		}

			st-speech-balloon-right .circle2 .center-element p {
				line-height: 2rem;
			}

@media screen and (max-width: 820px) {
	st-speech-balloon-left .circle1 {
		width: 250px;
		height: 250px;
	}

	st-speech-balloon-left .circle2 {
		width: 250px;
		height: 250px;
	}

		st-speech-balloon-left .circle2:before {
			top: 80%;
			left: 2%;
		}

		st-speech-balloon-left .circle2 .center-element p {
			line-height: 1.8rem;
		}

	st-speech-balloon-right {
		margin-left: 0rem;
		margin-top: 6rem;
	}

		st-speech-balloon-right .circle1 {
			width: 250px;
			height: 250px;
		}

		st-speech-balloon-right .circle2 {
			width: 250px;
			height: 250px;
		}

			st-speech-balloon-right .circle2:before {
				left: 79%;
			}

			st-speech-balloon-right .circle2:after {
				top: 81%;
			}

			st-speech-balloon-right .circle2 .center-element p {
				line-height: 1.8rem;
			}
}
		