@charset "utf-8";
/* CSS Document */

/*--------------------============-Blue=======================--------------------------*/


.bubbleBlue {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #00b0ff;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleBlue:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #00b0ff;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleBlue:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #00b0ff;
	background:#fff;
	border-radius:15px;
 display:block;
}


.ovalRightBlue {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #00b0ff;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightBlue:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #00b0ff;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightBlue:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #00b0ff;
	background:#fff;
	border-radius:15px;
 display:block;

}




/*--------------------============-Purple=======================--------------------------*/


.bubblePurple {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #7c4dff;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubblePurple:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #7c4dff;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubblePurple:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #7c4dff;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightPurple {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #7c4dff;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightPurple:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #7c4dff;
	background:#fff;
	border-radius:25px;
 display:block;

}

/* creates the smaller circle */

.ovalRightPurple:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #7c4dff;
	background:#fff;
	border-radius:15px;
 display:block;

}



/*--------------------============-Red=======================--------------------------*/


.bubbleRed {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #ff1744;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleRed:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #ff1744;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleRed:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #ff1744;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightRed {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #ff1744;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightRed:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #ff1744;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightRed:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #ff1744;
	background:#fff;
	border-radius:15px;
 display:block;

}



/*--------------------============-Green=======================--------------------------*/


.bubbleGreen {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #00e676;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleGreen:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #00e676;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleGreen:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #00e676;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightGreen {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #00e676;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightGreen:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #00e676;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightGreen:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #00e676;
	background:#fff;
	border-radius:15px;
 display:block;

}


/*--------------------============-Orange=======================--------------------------*/


.bubbleOrange {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #ff6d00;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleOrange:before {
	content:"";
	position:absolute;
	z-index:10;
	top:20px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #ff6d00;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleOrange:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #ff6d00;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightOrange {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #ff6d00;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightOrange:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #ff6d00;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightOrange:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #ff6d00;
	background:#fff;
	border-radius:15px;
 display:block;

}


/*--------------------============-PurpleRed=======================--------------------------*/


.bubblePurpleRed {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #ff4081;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubblePurpleRed:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #ff4081;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubblePurpleRed:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #ff4081;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightPurpleRed {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #ff4081;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightPurpleRed:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #ff4081;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightPurpleRed:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #ff4081;
	background:#fff;
	border-radius:15px;
 display:block;

}


/*--------------------============-Gray=======================--------------------------*/


.bubbleGray {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #bdbdbd;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleGray:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #bdbdbd;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleGray:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #bdbdbd;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightGray {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #bdbdbd;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightGray:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #bdbdbd;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightGray:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #bdbdbd;
	background:#fff;
	border-radius:15px;
 display:block;

}


/*--------------------============-Cyan=======================--------------------------*/


.bubbleCyan {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:1px solid #00e5ff;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleCyan:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:1px solid #00e5ff;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleCyan:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border: 1px solid #00e5ff;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightCyan {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #00e5ff;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightCyan:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #00e5ff;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightCyan:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #00e5ff;
	background:#fff;
	border-radius:15px;
 display:block;

}


/*--------------------============-Yellow=======================--------------------------*/


.bubbleYellow {
	position:relative;
	padding:40px 15px;
	margin:0 1.5em 40px 0;
	border:2px solid #ffea00;
	text-align:center;
	background:#fff;
	border-radius:240px / 140px;
}

/* creates the larger circle */
.bubbleYellow:before {
	content:"";
	position:absolute;
	z-index:10;
	top:25px;
	right:0px;
	width:20px;
	height:20px;
	border:2px solid #ffea00;
	background:#fff;
	border-radius:25px;
 display:block;
}

/* creates the smaller circle */
.bubbleYellow:after {
	content:"";
	position:absolute;
	z-index:10;
	top:40px;
	right:-20px;
	width:10px;
	height:10px;
	border:2px solid #ffea00;
	background:#fff;
	border-radius:15px;
 display:block;
}

.ovalRightYellow {
	position:relative;
	padding:50px 20px;
	margin:1em auto 80px;
	border:1px solid #ffea00;
	text-align:center;
	color:#333;
	background:#fff;
	border-radius:240px / 140px;

}

/* creates the larger circle */

.ovalRightYellow:before {
 content:"";
	position:absolute;
	z-index:10;
	bottom:-25px;
	left:100px;
	width:25px;
	height:25px;
	border:1px solid #ffea00;
	background:#fff;
	border-radius:25px;
 display:block;

}



/* creates the smaller circle */

.ovalRightYellow:after {
	content:"";
	position:absolute;
	z-index:10;
	bottom:-50px;
	left:120px;
	width:10px;
	height:10px;
	border: 1px solid #ffea00;
	background:#fff;
	border-radius:15px;
 display:block;

}
.container_12 .alpha { clear-left: 0; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12
{ margin: 0; padding: 0; border: 0; float: left; }

.container_12 { overflow: hidden; }

.container_12 .grid_1 {
	width: 8.333333333333334%;
}
.container_12 .grid_2 {
	width: 16.666666666666668%;
}
.container_12 .grid_3 {
	width: 25%;
}
.container_12 .grid_4 {
	width: 33.333333333333336%;
}
.container_12 .grid_5 {
	width: 41.66666666666667%;
}
.container_12 .grid_6 {
	width: 50%;
}
.container_12 .grid_7 {
	width: 58.333333333333336%;
}
.container_12 .grid_8 {
	width: 66.66666666666667%;
}
.container_12 .grid_9 {
	width: 75%;
}
.container_12 .grid_10 {
	width: 83.33333333333334%;
}
.container_12 .grid_11 {
	width: 91.66666666666667%;
}
.container_12 .grid_12 {
	width: 100%;
}

.container_16 .alpha { clear-left: 0; }

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16
{ margin: 0; padding: 0; border: 0; float: left; }

.container_16 { overflow: hidden; }

.container_16 .grid_1 {
	width: 6.25%;
}
.container_16 .grid_2 {
	width: 12.5%;
}
.container_16 .grid_3 {
	width: 18.75%;
}
.container_16 .grid_4 {
	width: 25%;
}
.container_16 .grid_5 {
	width: 31.25%;
}
.container_16 .grid_6 {
	width: 37.5%;
}
.container_16 .grid_7 {
	width: 43.75%;
}
.container_16 .grid_8 {
	width: 50%;
}
.container_16 .grid_9 {
	width: 56.25%;
}
.container_16 .grid_10 {
	width: 62.5%;
}
.container_16 .grid_11 {
	width: 68.75%;
}
.container_16 .grid_12 {
	width: 75%;
}
.container_16 .grid_13 {
	width: 81.25%;
}
.container_16 .grid_14 {
	width: 87.5%;
}
.container_16 .grid_15 {
	width: 93.75%;
}
.container_16 .grid_16 {
	width: 100%;
}

