.cntl
{
	position:relative;
	width:100%;
	overflow:hidden
}
.cntl-center
{
	left:0;
	right:0;
	margin-left:auto;
	margin-right:auto
}
.cntl-bar
{
	position:absolute;
	width:10px;
	top:5px;
	bottom:0;
	background-color:#fff;
}
.cntl-bar-fill
{
	background-color:#a40046;
	position:absolute;
	left:0;
	right:0;
	top:0;
	height:0
}	
.cntl-state
{
	position:relative;
	width:100%;
}
.cntl-state::after
{
	display:block;
	content:' ';
	clear:both
}
.cntl-icon
{
	border-radius:50%;
	width:20px;
	height:20px;
	background-color:#cfaa7a;
	box-shadow:0 0 19px -9px #000;
	position:absolute;top:0;
	text-align:center;
	line-height:80px;
	font-size:40px;
	color:#fff
}
.cntl-content
{
	width:40%;
	padding: 2%;		margin-bottom:2%;
	/*background-color:rgba(238,238,238,.25);*/
	border-radius:8px;
	float:left;opacity:0;
	position:relative;
	margin-left:-40%
}
.cntl-state:nth-child(2n+2) 
.cntl-content
{
	float:right;
	margin-right:-40%
}
.cntl-image
{
	opacity:0;
	width:40%;padding:2%
}
.cntl-state:nth-child(2n+1) 
.cntl-image
{
	float:right
}
.cntl-image img
{
	width:100%
}
.cntl-content h1
{
	font-size:50px !important;
	font-weight:400;
	margin-bottom:10px;
	font-family: "Myriad Pro";
	color: #cfaa7a;
}

.cntl-content p
{
	font-size:10px;
}
.cntl-bar-fill,.cntl-content,.cntl-image
{
	-webkit-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	transition:all 500ms ease
}
.cntl-state:nth-child(2n+2)
.cntl-animate .cntl-content
{
	margin-right:0
}
.cntl-animate .cntl-content
{
	opacity:1;
	margin-left:0
}
.cntl-animate .cntl-image
{
	opacity:1
}


@media (max-width:600px){
	.cntl-bar
	{
		left:auto;
		right:37px
	}
.cntl-content
{
	width:80%;
	float:none
}
	.cntl-state:nth-child(2n+2) 
.cntl-content
{
	margin-right:0;float:none
	}
	.cntl-image
	{
		width:80%
	}
.cntl-state:nth-child(2n+1) 
.cntl-image
{
	float:none
}
.animate .cntl-content
{
	margin-left:2%
}
.cntl-icon
{
	left:auto;
	right:0
}
}


@media (max-width: 599px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}

@media (max-width: 550px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}

@media (max-width: 500px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}

@media (max-width: 480px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}

@media (max-width: 400px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}


@media (max-width: 350px) {

	.cntl-bar {
		left:auto;
		right: 5px;
	}

	.cntl-content {
		width:80%;
		float:none;
	}
	.cntl-state:nth-child(2n+2) .cntl-content {
		margin-right:0%;
		float:none;
	}

	.cntl-image {
		width:80%;
	}

	.cntl-state:nth-child(2n+1) .cntl-image {
		float:none;
	}

	.animate .cntl-content {
		margin-left: 2%;
	}

	.cntl-icon {
		left: auto;
		right: 0;
	}

}