
	/* ALL LISTS */

	.list .section-caption { padding: 0 0 40px 0; }
	.list .section-caption:after { content: ''; display: block; clear: both; }
	.list .section-caption h2 { font-size: 350%; font-family: 'GOSTUI2 Bold'; line-height: 100%; float: left; padding: 4px 0; text-transform: uppercase;  margin: 0;}
	.list .section-caption .actions { float: left; margin-left: 30px; }
	.list .section-caption .actions .button {  }
	.list .section-list li .link-overlay { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 4; display: block; }
	.list .section-list li .preview-holder { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; overflow: hidden; z-index: 1; }
	.list .section-list li .text { font-size: 130%; }
	.list .section-list li .text h3 { padding: 20px 0; }
	.list .section-list li .text p { padding-bottom: 20px; }
	.list .section-list li .text ul { padding-bottom: 20px; }
	.list .section-list li time { position: absolute; left: 30px; bottom: 80px; font-family: 'GOSTUI2 Bold'; color: #fff; line-height: 100%; height: 30px; display: inline-block; z-index: 2; }
	.list .section-list li time big { display: inline-block; font-size: 300%; line-height: 100%; height: 35px; }
	.list .section-list li time small { opacity: 0.5; font-size: 160%; line-height: 100%; height: 20px; display: inline-block; margin: 2px 0 0 5px; }



	/* LIST 1 */

	.list-1 { margin: 0 0 60px 0; }
	.list-1 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-1 .section-list:after { content: ''; display: block; clear: both; }
	.list-1 .section-list li { background: #fff; margin-bottom: 30px; position: relative; float: left; margin: 30px 15px 0 15px; }
	.list-1 .section-list li .number { font-family: 'PFDinStencilPro-Thin'; font-size: 450%; line-height: 100%; position: absolute; left: 30px; top: 30px; z-index: 2; }
	.list-1 .section-list li .preview-holder { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 1; overflow: hidden; }
	.list-1 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; }
	.list-1 .section-list li .caption-holder { position: absolute; left: 30px; bottom: 65px; z-index: 3;}
	.list-1 .section-list li .caption-holder .caption-text { font-family: 'GOSTUI2 Bold'; font-size: 200%; text-transform: uppercase; margin-bottom: 10px; }
	.list-1 .section-list li .caption-holder .subcaption-text { font-family: 'Roboto Regular'; font-size: 110%; }
	.list-1 .section-list li .actions { position: absolute; bottom: 30px; left: 30px; z-index: 5; }



	/* LIST 2 */

	.list-2 { margin: 0 0 60px 0; }
	.list-2 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-2 .section-list:after { content: ''; display: block; clear: both; }
	.list-2 .section-list li { background: #fff; margin: 30px 15px 0 15px; float: left; position: relative; }
	.list-2 .section-list li:after { content: ''; display: block; width: 100%; height: 3px; background: #247ecf; position: absolute; left: 0px; bottom: 0px; z-index: 4; }
	.list-2 .section-list li .preview-holder:after { content: ''; display: block; position: absolute; left: 0px; bottom: 80px; width: 100%; height: 100px; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5)); }
	.list-2 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
	.list-2 .section-list li .caption-holder { background: #fff; padding: 0 30px; height: 80px; font-family: 'Roboto Regular'; font-size: 140%; line-height: 120%; position: absolute; bottom: 0px; left: 0px; right: 0px; z-index: 3; }
	.list-2 .section-list li .caption-holder .caption-text { height: inherit; display: table-cell; vertical-align: middle; }



	/* LIST 3 */

	.list-3 { margin: 0 0 60px 0; }
	.list-3 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-3 .section-list:after { content: ''; display: block; clear: both; }
	.list-3 .section-list li { background: #fff; margin: 30px 15px 0 15px; float: left; position: relative; }
	.list-3 .section-list li:after { content: ''; display: block; width: 3px; height: 30px; background: #247ecf; position: absolute; left: 0px; bottom: 25px; z-index: 4; }
	.list-3 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
	.list-3 .section-list li .caption-holder { background: #fff; padding: 0 30px; height: 80px; font-family: 'GOSTUI2 Bold'; font-size: 140%; line-height: 120%; position: absolute; bottom: 0px; left: 0px; right: 0px; z-index: 3; text-transform: uppercase; }
	.list-3 .section-list li .caption-holder .caption-text { height: inherit; display: table-cell; vertical-align: middle; }



	/* LIST 4 */

	.list-4 { margin: 0 0 60px 0; }
	.list-4 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-4 .section-list:after { content: ''; display: block; clear: both; }
	.list-4 .section-list li { width: 420px; height: 330px; background: #fff; margin: 30px 15px 0 15px; float: left; position: relative; }
	.list-4 .section-list li:after { content: ''; display: block; width: 3px; height: 30px; background: #247ecf; position: absolute; left: 0px; bottom: 25px; z-index: 4; }
	.list-4 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
	.list-4 .section-list li .caption-holder { background: #fff; padding: 0 30px; height: 80px; position: absolute; bottom: 0px; left: 0px; right: 0px; z-index: 3; }
	.list-4 .section-list li .caption-holder .caption-text { height: inherit; display: table-cell; vertical-align: middle; text-transform: uppercase; font-family: 'GOSTUI2 Bold'; font-size: 140%; line-height: 120%; }
	.list-4 .section-list li .subcaption-holder { padding: 0 30px; height: 80px; position: absolute; bottom: 0px; left: 0px; right: 0px; z-index: 3; }
	.list-4 .section-list li .subcaption-holder .subcaption-text { height: inherit; display: table-cell; vertical-align: middle; font-size: 110%; line-height: 110%; color: #aaa; }



	/* LIST 5 */

	.list-5 { margin: 0 0 60px 0; }
	.list-5 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-5 .section-list:after { content: ''; display: block; clear: both; }
	.list-5 .section-list > li { width: 645px; background: #fff; margin-bottom: 30px; position: relative; float: left; margin: 30px 15px 0 15px; padding: 60px 0; }
	.list-5 .section-list > li .number { font-family: 'PFDinStencilPro-Thin'; font-size: 450%; line-height: 100%; position: absolute; right: 30px; top: 55px; z-index: 2; }
	.list-5 .section-list > li .caption { font-family: 'GOSTUI2 Bold'; font-size: 140%; text-transform: uppercase; margin-bottom: 10px; margin: 0px 100px 0 30px; }
	.list-5 .section-list > li ul { margin: 20px 0 0 30px; font-size: 130%; }



	/* LIST 6 */

	.list-6 {  }
	.list-6 .section-list { list-style: none; background: #fff; }
	.list-6 .section-list > li { position: relative; }
	.list-6 .section-list > li:first-child { border-top: none; }
	.list-6 .section-list > li:after { content: ''; display: block; position: absolute; bottom: 0px; left: 30px; right: 30px; border-top: solid 1px #ddd; }
	.list-6 .section-list > li:last-child:after { display: none; }
	.list-6 .section-list > li .caption { padding: 30px; font-family: 'GOSTUI2 Bold'; font-size: 140%; text-transform: uppercase; margin-bottom: 10px; margin: 0px; position: relative; min-height: 30px; line-height: 170%; }
	.list-6 .section-list > li .caption i { position: absolute; right: 30px; top: 30px; box-shadow: inset 0 0 0 2px #247ecf; }
	.list-6 .section-list > li .text { position: relative; padding: 0 30px 10px 30px; display: none; }
	.list-6 .section-list > li.active .caption i {  }



	/* LIST 7 */

	.list-7 { margin: 0 0 60px 0; }
	.list-7 .section-list { list-style: none; margin: -30px 0 0 0; }
	.list-7 .section-list:after { content: ''; display: block; clear: both; }
	.list-7 .section-list li { min-height: 260px; background: #fff; margin-bottom: 30px; position: relative; float: left; margin: 60px 0 0 60px; }
	.list-7 .section-list li .number { font-family: 'PFDinStencilPro-Thin'; font-size: 450%; line-height: 100%; position: absolute; right: 30px; top: 30px; z-index: 2; }
	.list-7 .section-list li .preview-holder { position: relative; width: 260px; height: 260px; z-index: 1; overflow: hidden; background: #fff; margin: -30px 30px 0 -60px; float: left; }
	.list-7 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }
	.list-7 .section-list li .caption-holder { vertical-align: middle; padding: 45px 0; }
	.list-7 .section-list li .caption-holder .caption-text { font-family: 'GOSTUI2 Bold'; font-size: 180%; text-transform: uppercase; }
	.list-7 .section-list li .text { border-top: solid 1px #ddd; padding-top: 30px; font-size: 130%; margin: 0 30px 0 230px; line-height: 140%; }



	/* LIST 8 */

	.list-8 { margin: 0 0 60px 0; }
	.list-8 .section-list { list-style: none; margin: -30px -15px 0 -15px; }
	.list-8 .section-list:after { content: ''; display: block; clear: both; }
	.list-8 .section-list li { background: #fff; margin: 30px 15px 0 15px; float: left; position: relative; }
	.list-8 .section-list li:after { content: ''; display: block; width: 100%; height: 3px; background: #247ecf; position: absolute; left: 0px; bottom: 0px; z-index: 4; }
	.list-8 .section-list li .preview-holder:after { content: ''; display: block; position: absolute; left: 0px; bottom: 0px; width: 100%; height: 100px; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.5)); }
	.list-8 .section-list li .preview-holder .preview-image { width: 100%; height: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; }



	/* ANIMATION - ALL LISTS */

	.list-1 .section-list li .preview-holder .preview-image
	{
		transition: all 5s 0.0s linear;
	}

	.list-1 .section-list li .caption-holder .caption-text,
	.list-1 .section-list li .caption-holder .subcaption-text,
	.list-2 .section-list li:after,
	.list-2 .section-list li .preview-holder .preview-image,
	.list-3 .section-list li:after,
	.list-3 .section-list li .preview-holder .preview-image,
	.list-4 .section-list li:after,
	.list-4 .section-list li .preview-holder .preview-image,
	.list-4 .section-list li .caption-holder,
	.list-4 .section-list li .subcaption-holder,
	.list-7 .section-list li .caption-holder .caption-text,
	.list-8 .section-list li:after,
	.list-8 .section-list li .preview-holder .preview-image
	{
		transition: all 0.3s 0.0s ease;
	}



	/* ANIMATION - LIST 1 */

	.list-1 .section-list li .preview-holder .preview-image {
		transform: translate3d(0px,0px,0px);
	}
	.list-1 .section-list li:hover .preview-holder .preview-image {
		transform: translate3d(30px,-20px,0px);
	}
	.list-1 .section-list li .caption-holder .caption-text {
		transform: translateY(0px);
	}
	.list-1 .section-list li .caption-holder .subcaption-text {
		transform: translateY(0px);
	}
	.list-1 .section-list li:hover .caption-holder .caption-text {
		transform: translateY(-10px);
	}
	.list-1 .section-list li:hover .caption-holder .subcaption-text {
		transform: translateY(-5px);
	}



	/* ANIMATION - LIST 2 */

	.list-2 .section-list li:after { opacity: 0; }
	.list-2 .section-list li:hover:after { opacity: 1; }
	.list-2 .section-list li .preview-holder .preview-image {
		transform: translateY(-40px);
	}
	.list-2 .section-list li:hover .preview-holder .preview-image {
		transform: translateY(-45px) scale(1.05);
		transition: ease-in-out 0.2s;
	}



	/* ANIMATION - LIST 3 */

	.list-3 .section-list li .preview-holder .preview-image {
		transform: translateY(0px);
	}
	.list-3 .section-list li:hover .preview-holder .preview-image {
		transform: translateY(-10px);
	}



	/* ANIMATION - LIST 4 */

	.list-4 .section-list li .preview-holder .preview-image {
		transform: translateY(0px);
	}
	.list-4 .section-list li:hover .preview-holder .preview-image {
		transform: translateY(-10px);
	}
	.list-4 .section-list li .caption-holder {
		transform: translateY(0px);
	}
	.list-4 .section-list li:hover .caption-holder {
		transform: translateY(-30px);
	}
	.list-4 .section-list li .subcaption-holder { opacity: 0;
		transform: translateY(30px);
	}
	.list-4 .section-list li:hover .subcaption-holder { opacity: 1;
		transform: translateY(0px);
	}
	.list-4 .section-list li:after {
		transform: translateY(0px);
	}
	.list-4 .section-list li:hover:after {
		transform: translateY(-30px);
	}



	/* ANIMATION - LIST 5 */



	/* ANIMATION - LIST 6 */

	.list-6 .section-list > li .caption i { transform: rotateZ(0deg); }
	.list-6 .section-list > li.active .caption i { transform: rotateZ(90deg); }



	/* ANIMATION - LIST 7 */

	.list-7 .section-list li .caption-holder .caption-text { color: #000; }
	.list-7 .section-list li:hover .caption-holder .caption-text { color: #247ecf; }



	/* ANIMATION - LIST 8 */

	.list-8 .section-list li:after { opacity: 0; }
	.list-8 .section-list li:hover:after { opacity: 1; }
	.list-8 .section-list li .preview-holder .preview-image {
		transform: scale(1.05);
	}
	.list-8 .section-list li:hover .preview-holder .preview-image {
		transform: scale(1.1);
	}



	/* 0-768 */
	@media screen and (max-width:768px) {

		.list .section-caption h2 { font-size: 250%; }
		.list .section-caption .actions { float: none; margin-left: 0px; clear: both; }
		.list .section-list li time { left: 20px; }

		.list-1 .section-list li { width: 300px; height: 400px; }
		.list-1 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-1 .section-list li .caption-holder { left: 20px; right: 20px; bottom: 55px; }
		.list-1 .section-list li .actions { left: 20px; bottom: 20px; }

		.list-2 .section-list li { width: 300px; height: 300px; }
		.list-2 .section-list li .caption-holder { font-size: 120%; padding: 0 20px; }

		.list-3 .section-list li { width: 300px; height: 300px; }

		.list-4 .section-list li { width: 300px; height: 300px; }
		.list-4 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-4 .section-list li .caption-holder { height: 100px; }

		.list-5 .section-list { margin: 0px; }
		.list-5 .section-list > li { display: block; width: 100%; box-sizing: border-box; margin: 30px 0px 0 0px; padding: 30px 0; }
		.list-5 .section-list > li .number { top: 21px; }
		.list-5 .section-list > li ul { margin-right: 10px; }

		.list-7 .section-list li { margin: 0 0 30px 0; }
		.list-7 .section-list li .number { right: 20px; top: 20px; }
		.list-7 .section-list li .preview-holder { width: 100%; height: 300px; margin: 90px 0 0 0; float: none; }
		.list-7 .section-list li .caption-holder { padding: 40px 20px 20px 20px; text-align: center; line-height: 140%; }
		.list-7 .section-list li .caption-holder .caption-text { line-height: 120%; }
		.list-7 .section-list li .text { margin: 0px; padding: 0 20px 20px 20px; border: none; }

		.list-8 .section-list li { width: 300px; height: 220px; }
		.list-8 .section-list li .caption-holder { font-size: 120%; padding: 0 20px; }

	}

	/* 768-1024 */
	@media screen and (min-width:769px) and (max-width:1024px) {
		.list-1 .section-list li { width: 768px; height: 374px; }
		.list-1 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-2 .section-list li { width: 768px; height: 374px; }
		.list-3 .section-list li { width: 768px; height: 374px; }
		.list-4 .section-list { margin: -30px 0px 0 0px; }
		.list-4 .section-list li { width: 768px; height: 374px; margin: 30px 0px 0 0px; }
		.list-4 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-5 .section-list li { width: 768px; }
		.list-8 .section-list li { width: 768px; height: 420px; }
	}

	/* 1024-1280 */
	@media screen and (min-width:1025px) and (max-width:1280px) {
		.list-1 .section-list li { width: 425px; height: 374px; }
		.list-1 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-2 .section-list li { width: 425px; height: 374px; }
		.list-3 .section-list li { width: 425px; height: 374px; }
		.list-4 .section-list li { width: 425px; height: 300px; }
		.list-4 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-5 .section-list li { width: 425px; }
		.list-5 .section-list > li { min-height: 170px; }
		.list-5 .section-list > li .caption { height: 43px; }
		.list-8 .section-list li { width: 425px; height: 244px; }
	}

	/* 1280-1440 */
	@media screen and (min-width:1281px) and (max-width:1440px) {
		.list-1 .section-list li { width: 555px; height: 357px; }
		.list-1 .section-list li .preview-holder .preview-image { background-size: cover; }
		.list-2 .section-list li { width: 360px; height: 316px; }
		.list-3 .section-list li { width: 360px; height: 316px; }
		.list-4 .section-list li { width: 555px; height: 357px; }
		.list-4 .section-list li .preview-holder .preview-image { background-size: cover; }
		.list-5 .section-list li { width: 555px; }
		.list-8 .section-list li { width: 360px; height: 200px; }
	}

	/* 1440+ */
	@media screen and (min-width:1441px) {
		.list-1 .section-list li { width: 635px; height: 408px; }
		.list-1 .section-list li .preview-holder .preview-image { background-size: cover; }
		.list-2 .section-list li { width: 413px; height: 360px; }
		.list-3 .section-list li { width: 302px; height: 328px; }
		.list-4 .section-list li { width: 413px; height: 300px; }
		.list-4 .section-list li .preview-holder .preview-image { background-size: contain; }
		.list-5 .section-list li { width: 635px; }
		.list-8 .section-list li { width: 413px; height: 245px; }
	}
