*{
	box-sizing:border-box;
}

body{
	min-width:320px;
}

	.container{
		/*width:100% !important;*/
	}


/* -- Connected Inforgraphic
--------------------------------------- */

	.ConnectedInfographic{
		width:100%;
		max-width:1100px;
		height:auto;

		display:block;
		position:relative;

		margin:0px auto !important;
		padding:0px;
		border:0px none;
	}

		.ConnectedInfographic::after{
			display:block;
			clear:both;
			content:'';
		}


		/* Graphic */
		.ConnectedInfographic__graphic{
			width:680px;
			height:245px;

			display:block;
			position:relative;

			margin:20px auto !important;
			padding:0px;
			border:0px none;
		}

		@media screen and (max-width:640px){
			.ConnectedInfographic__graphic{
				width:245px;
				height:680px;
			}
		}


			/* Image */
			.ConnectedInfographic__graphic img.imageDesktop,
			.ConnectedInfographic__graphic img.imageMobile{
				width:680px;
				height:245px;

				display:block;
				position:relative;
				z-index:0;

				margin:0px auto !important;
				padding:0px;
				border:0px none;
			}

			.ConnectedInfographic__graphic img.imageMobile{
				width:245px;
				height:680px;

				display:none;
			}

			@media screen and (max-width:640px){
				.ConnectedInfographic__graphic img.imageDesktop{
					display:none;
				}
				.ConnectedInfographic__graphic img.imageMobile{
					display:block;
				}

			}


			/* Buttons */
			.ConnectedInfographic__buttons{
				width:680px;
				height:245px;

				display:block;
				position:absolute;
				top:0px;
				left:0px;
				z-index:10;

				margin:0px auto !important;
				padding:0px;
				border:0px none;
			}

			@media screen and (max-width:640px){
				.ConnectedInfographic__buttons{
					width:245px;
					height:680px;
				}
			}

				.ConnectedInfographic__buttons button{
					background-color:transparent !important;

					width:245px;
					height:245px;

					display:block;
					position:absolute;

					font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;
					font-size:2.75em;

					margin:0px auto !important;
					padding:0px 0px 7px;
					border:0px none;
					
					opacity:1.0;

					-webkit-border-radius:122.5px;
					   -moz-border-radius:122.5px;
						-ms-border-radius:122.5px;
						 -o-border-radius:122.5px;
							border-radius:122.5px;

					-webkit-transition:opacity 250ms ease-in-out;
					   -moz-transition:opacity 250ms ease-in-out;
						-ms-transition:opacity 250ms ease-in-out;
						 -o-transition:opacity 250ms ease-in-out;
							transition:opacity 250ms ease-in-out;
				}

				.ConnectedInfographic__buttons button:hover{
					opacity:0.75;
				}
				
					.ConnectedInfographic__buttons button#Connected{
						left:0px;
						top:0px;
						color:#00A3A1;
					}

					.ConnectedInfographic__buttons button#Powered{
						left:50%;
						top:0px;
						color:#1B8ECE;
						-webkit-transform:translateX(-50%);
						   -moz-transform:translateX(-50%);
							-ms-transform:translateX(-50%);
							 -o-transform:translateX(-50%);
								transform:translateX(-50%);
					}

					.ConnectedInfographic__buttons button#Trusted{
						right:0px;
						top:0px;
						color:#6C2477;
					}

					@media screen and (max-width:640px){
						.ConnectedInfographic__buttons button#Connected{
							left:0px;
							top:0px;
						}
						.ConnectedInfographic__buttons button#Powered{
							left:0px;
							top:50%;
							-webkit-transform:translateY(-50%);
							   -moz-transform:translateY(-50%);
								-ms-transform:translateY(-50%);
								 -o-transform:translateY(-50%);
									transform:translateY(-50%);
						}
						.ConnectedInfographic__buttons button#Trusted{
							right:auto;
							top:auto;
							left:0px;
							bottom:0px;
						}
					}


			/* Buttons */
			.ConnectedInfographic__colours{
				width:680px;
				height:245px;

				display:none;
				position:absolute;
				top:0px;
				left:0px;
				z-index:20;

				margin:0px auto !important;
				padding:0px;
				border:0px none;
			}

			@media screen and (max-width:640px){
				.ConnectedInfographic__colours{
					width:245px;
					height:680px;
				}
			}

				.ConnectedInfographic__colours div{
					width:245px;
					height:245px;

					display:none;
					position:absolute;
					top:0px;

					margin:0px auto !important;
					padding:0px;
					border:0px none;
					
					opacity:1.0;

					-webkit-border-radius:122.5px;
					   -moz-border-radius:122.5px;
						-ms-border-radius:122.5px;
						 -o-border-radius:122.5px;
							border-radius:122.5px;

					-webkit-transition:width 500ms ease-in-out;
					   -moz-transition:width 500ms ease-in-out;
						-ms-transition:width 500ms ease-in-out;
						 -o-transition:width 500ms ease-in-out;
							transition:width 500ms ease-in-out;
				}

				.ConnectedInfographic__colours div.jsStretched{
					width:680px;
				}

				@media screen and (max-width:640px){
					.ConnectedInfographic__colours div{
						-webkit-transition:height 500ms ease-in-out;
						   -moz-transition:height 500ms ease-in-out;
							-ms-transition:height 500ms ease-in-out;
							 -o-transition:height 500ms ease-in-out;
								transition:height 500ms ease-in-out;
					}

					.ConnectedInfographic__colours div.jsStretched{
						width:245px;
						height:680px;
					}
				}
				
					.ConnectedInfographic__colours div.colorConnected{
						background-color:#00A3A1;
						left:0px;
					}

					.ConnectedInfographic__colours div.colorPowered{
						background-color:#0091DA;
						left:50%;
						-webkit-transform:translateX(-50%);
						   -moz-transform:translateX(-50%);
							-ms-transform:translateX(-50%);
							 -o-transform:translateX(-50%);
								transform:translateX(-50%);
					}

					.ConnectedInfographic__colours div.colorTrusted{
						background-color:#6C2477;
						right:0px;
					}

					@media screen and (max-width:640px){
						.ConnectedInfographic__colours div.colorConnected{
							left:0px;
							top:0px;
						}
						.ConnectedInfographic__colours div.colorPowered{
							left:0px;
							top:50%;
							-webkit-transform:translateY(-50%);
							   -moz-transform:translateY(-50%);
								-ms-transform:translateY(-50%);
								 -o-transform:translateY(-50%);
									transform:translateY(-50%);
						}
						.ConnectedInfographic__colours div.colorTrusted{
							right:auto;
							top:auto;
							left:0px;
							bottom:0px;
						}
					}


			/* Texts */
			.ConnectedInfographic__texts{
				width:680px;
				height:245px;

				display:none;
				position:absolute;
				top:0px;
				left:0px;
				z-index:20;

				margin:0px auto !important;
				padding:0px;
				border:0px none;
			}

			@media screen and (max-width:640px){
				.ConnectedInfographic__texts{
					width:245px;
					height:680px;
				}
			}


				.ConnectedInfographic__texts button{
					background:transparent;

					width:40px;
					height:40px;

					display:block;
					position:absolute;
					top:15px;
					right:90px;
					z-index:10;

					margin:0px auto !important;
					padding:0px;
					border:0px none;

					opacity:1.0;

					-webkit-transition:opacity 250ms ease-in-out;
					   -moz-transition:opacity 250ms ease-in-out;
						-ms-transition:opacity 250ms ease-in-out;
						 -o-transition:opacity 250ms ease-in-out;
							transition:opacity 250ms ease-in-out;
				}

				@media screen and (max-width:640px){
					.ConnectedInfographic__texts button{
						top:40px;
						right:auto;
						left:50%;

						-webkit-transform:translateX(-50%);
						   -moz-transform:translateX(-50%);
							-ms-transform:translateX(-50%);
							 -o-transform:translateX(-50%);
								transform:translateX(-50%);
					}
				}

				.ConnectedInfographic__texts button:hover{
					opacity:0.75;
				}

					.ConnectedInfographic__texts button::before,
					.ConnectedInfographic__texts button::after{
						background:#FFFFFF;

						width:75%;
						height:3px;

						display:block;
						position:absolute;
						top:50%;
						left:50%;

						margin:0px auto !important;
						padding:0px;
						border:0px none;

						-webkit-transform:translateX(-50%) translateY(-50%) rotate(45deg);
						   -moz-transform:translateX(-50%) translateY(-50%) rotate(45deg);
							-ms-transform:translateX(-50%) translateY(-50%) rotate(45deg);
							 -o-transform:translateX(-50%) translateY(-50%) rotate(45deg);
								transform:translateX(-50%) translateY(-50%) rotate(45deg);

						content:'';
					}
					
					.ConnectedInfographic__texts button::after{
						-webkit-transform:translateX(-50%) translateY(-50%) rotate(-45deg);
						   -moz-transform:translateX(-50%) translateY(-50%) rotate(-45deg);
							-ms-transform:translateX(-50%) translateY(-50%) rotate(-45deg);
							 -o-transform:translateX(-50%) translateY(-50%) rotate(-45deg);
								transform:translateX(-50%) translateY(-50%) rotate(-45deg);
					}


				.ConnectedInfographic__texts div{
					width:680px;
					height:auto;

					display:none;
					position:absolute;
					top:50%;
					left:-50px;
					z-index:0;

					text-align:left;

					margin:0px auto !important;
					padding:0px 100px;
					border:0px none;

					-webkit-transform:translateY(-50%);
					   -moz-transform:translateY(-50%);
						-ms-transform:translateY(-50%);
						 -o-transform:translateY(-50%);
							transform:translateY(-50%);

					-webkit-transition:left 500ms ease-in-out;
					   -moz-transition:left 500ms ease-in-out;
						-ms-transition:left 500ms ease-in-out;
						 -o-transition:left 500ms ease-in-out;
							transition:left 500ms ease-in-out;
				}

				.ConnectedInfographic__texts div.jsShowing{
					left:0px;
				}

				@media screen and (max-width:640px){
					.ConnectedInfographic__texts div{
						width:245px;
						height:680px;

						top:50px;
						left:0px;

						text-align:center;
					
						padding:100px 40px 0px;

						-webkit-transform:translateY(0);
						   -moz-transform:translateY(0);
							-ms-transform:translateY(0);
							 -o-transform:translateY(0);
								transform:translateY(0);

						-webkit-transition:top 500ms ease-in-out;
						   -moz-transition:top 500ms ease-in-out;
							-ms-transition:top 500ms ease-in-out;
							 -o-transition:top 500ms ease-in-out;
								transition:top 500ms ease-in-out;
					}

					.ConnectedInfographic__texts div.jsShowing{
						top:0px;
					}
				}

					.ConnectedInfographic__texts h3{
						color:#FFFFFF !important;
						font-family:'Open Sans Condensed', Arial, Helvetica, sans-serif;
						font-size:2.25em;
						line-height:1.1;
						margin:0px auto !important;
					}

					.ConnectedInfographic__texts p{
						color:#FFFFFF !important;
						font-size:0.85em;
						margin:10px auto !important;
					}
				
					@media screen and (max-width:640px){
						.ConnectedInfographic__texts p{
							margin:20px auto !important;
						}
					}

					.ConnectedInfographic__texts a,
					.ConnectedInfographic__texts a:hover{
						display:inline-block;
						position:relative;
						
						color:#FFFFFF !important;
						font-weight:bold;
						text-decoration:none;
						
						margin:0px auto 5px !important;
						padding-right:15px;

						opacity:1.0;

						-webkit-transition:opacity 250ms ease-in-out;
						   -moz-transition:opacity 250ms ease-in-out;
							-ms-transition:opacity 250ms ease-in-out;
							 -o-transition:opacity 250ms ease-in-out;
								transition:opacity 250ms ease-in-out;
					}

					.ConnectedInfographic__texts a:hover{
						opacity:0.75;
					}

						.ConnectedInfographic__texts a::before{
							width:9px;
							height:9px;

							display:block;
							position:absolute;
							right:0px;
							top:50%;

							margin:0px auto !important;
							padding:0px;
							border:0px none;

							border-right:3px solid #FFFFFF;
							border-bottom:3px solid #FFFFFF;

							-webkit-transform:translateY(-50%) rotate(-45deg);
							   -moz-transform:translateY(-50%) rotate(-45deg);
								-ms-transform:translateY(-50%) rotate(-45deg);
								 -o-transform:translateY(-50%) rotate(-45deg);
									transform:translateY(-50%) rotate(-45deg);

							content:'';
						}




/* -- Editor Note
---------------------------------------- */
	
	.editorNote{
		background-color:#90EE90;

		width:100%;
		height:auto;

		display:none;
		position:relative;

		color:#0f5d0f;
		font-size:12px;
		text-align:center;

		margin:0px auto;
		padding:30px;
		border:0px none;
	}

		.editorNote small{
			display:block;
			font-size:0.75em;
			margin-top:5px;
		}


	.cq-Editable-dom .editorNote{
		display:block;
	}