.cnc-wrap
{
	max-width: 1440px;
	width: 90%;
	margin: auto;
}

.cnc-list-anchor
{
	display: block;
	width: 100%;
	text-align: center;
	padding: 50px 20px;
	position: relative;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.cnc-list-anchor:hover
{
	color: #ffffff;
}

.cnc-list
{
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
	margin: -20px;
	padding: 0;
}

.cnc-list-element-inner
{
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
	border: 1px solid #48556e;
	min-height: 100%;
	position: relative;
}

.cnc-list-element
{
	width: 25%;
	padding: 20px;
	display: block;
	 flex: 1 1 auto;
    -webkit-align-self: auto;
    -ms-flex-item-align: auto;
}

@keyframes rollRightIN {
    0 {right: 100%;}
    100% {right: 0;}
}

.cnc-list-element-inner:before
{
	content: "";
	position: absolute;
	background: #48556e;
	opacity: 0.65;
	left: 0;
	top: 0;
	bottom: 0;
	right: 100%;
}

.cnc-list-element-inner:hover:before
{
	animation-name: rollRightIN;
    animation-duration: 1s;
	animation-fill-mode: forwards;
}

@media all and (max-width: 767px)
{
	.cnc-list-element
	{
		width: 50%;
	}
}

@media all and (max-width: 479px)
{
	.cnc-list-element
	{
		width: 100%;
		padding: 10px 0;
	}
	
	.cnc-list
	{
		margin: -20px 0;
	}
}