/* Circular Content Carousel Style */
.ca-container{
	position:relative;
	margin:25px auto 20px auto;
	width:80%;
	height:550px;
}
.ca-wrapper{
	width:100%;
	height:100%;
	position:relative;
}


#fade{
	position: absolute;
	z-index: 2;
	left: 0;
	top: 35%;
	pointer-events: none;
}

#fade2{
	position: absolute;
	z-index: 2;
	right: 0;
	top: 35%;
	pointer-events: none;
}

.ca-item{
	position:relative;
	float:left;
	width:25%;
	height:100%;
	text-align:center;
	margin: 0;
}

.ca-item-main{
	padding:20px;
	position:absolute;
	top:5px;
	left:5px;
	right:5px;
	bottom:5px;
	background: url(../images/road-27.svg) no-repeat center 40%;
	background-size: 100%;
	overflow:hidden;
	text-align: center;
	margin-left: -11px;
}

#first .ca-item-main{
	background: url(../images/road-26.svg) no-repeat center 40%;
}

#last .ca-item-main{
	background: url(../images/road-28.svg) no-repeat center 40%;
}

#year{
	width: 90px;
	height: 95px;
	background: url(../images/year-30.svg) no-repeat top center;
	background-size: 100%;
	font-family: 'GothamBlack';
	font-size: 18px;
	line-height: 90px;
	color: #fed925;
	position: absolute;
	left: 50%;
	top: 20%;
	z-index: 3;
}

.ca-item-main p{
	position: absolute;
	top: 55%;
	padding: 0 10px;
	z-index: 3;
	font-size: 13px;
}


.ca-nav span{
	width:25px;
	height:38px;
	background:transparent url(../images/arrows.png) no-repeat top left;
	position:absolute;
	top:50%;
	margin-top:-19px;
	left:-40px;
	text-indent:-9000px;
	opacity:0.7;
	cursor:pointer;
	z-index:100;
}
.ca-nav span.ca-nav-next{
	background-position:top right;
	left:auto;
	right:-40px;
}
.ca-nav span:hover{
	opacity:1.0;
}

@media only screen and (min-width:0px) and (max-width:499px){

.ca-container{
	width:90%;
	height:450px;
}


#fade{
	top: 32%;
}

#fade2{
	top: 32%;
}

.ca-item{
	width:100%;
	height:100%;
	margin: 0;
}
	
#year{
	width: 90px;
	height: 95px;
	font-size: 18px;
	line-height: 90px;
	left: 40%;
	top: 20%;
}
	
.ca-item-main p{
	font-size: 11px;
}
	
}


@media only screen and (min-width:500px) and (max-width:1023px){

.ca-container{
	width:100%;
	height:450px;
}


#fade{
	top: 31%;
}

#fade2{
	top: 31%;
}

.ca-item{
	width:50%;
	height:100%;
	margin: 0;
}
	
#year{
	width: 90px;
	height: 95px;
	font-size: 18px;
	line-height: 90px;
	left: 45%;
	top: 20%;
}
	
.ca-item-main p{
	font-size: 11px;
}
	
}


@media only screen and (min-width:1024px) and (max-width:1250px){

.ca-container{
	width:100%;
	height:450px;
}


#fade{
	top: 33%;
}

#fade2{
	top: 33%;
}

.ca-item{
	width:33%;
	height:100%;
	margin: 0;
}
	
.ca-item-main p{
	font-size: 12px;
}
	
}

@media only screen and (min-width:1251px) and (max-width:1550px){

.ca-container{
	width:100%;
	height:450px;
}


#fade{
	top: 30%;
}

#fade2{
	top: 30%;
}

.ca-item{
	width:33%;
	height:100%;
	margin: 0;
}
	
}