/* Collection
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.header-image {
    background-repeat: no-repeat;
    background-size: 1000px 680px;
    position: absolute;
    -webkit-transition: all 450ms cubic-bezier(.02, .01, .47, 1);
    -moz-transition: all 450ms cubic-bezier(.02, .01, .47, 1);
    transition: all 450ms cubic-bezier(.02, .01, .47, 1);
    background-position: bottom center;
    width: 100%;
    height: 680px;
    opacity: 0;
    left:0;
	top: 66px;
}

.container--full-screen {
	min-height: 680px;
	margin: 66px 0;
	background-color: #0C0C0C;
	z-index: -1;
	padding:0 20px;
}

.visible {
	opacity: 1;
}
.content {
	padding: 80px 20px 0 20px;
}
.content-wrapper {
	padding:0 20px;
}
.container--hero {
	z-index: 1;
}
.header-details-container {
	text-align: center;
}
.home-container{
	max-width:1185px;
	margin: 0 auto 86px auto;
}
.action_bar-wrapper {
	margin-bottom: -36px;
	z-index: 1;
}

h1 {
	margin: 60px 0 16px 0;
	color: white;
}
.header-details-container p {
	color: white;
	padding: 0 50px;
}

p {
    max-width: 600px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
}

@media only screen and (max-width: 890px) {
	.card-list-wrapper li{
		width: 100%;
		text-align: center;
	}
	.card-list-wrapper li a{
		margin-left: auto;
		margin-right: auto;
	}
}

@media only screen and (max-width: 1225px) {
	.home-container {
		max-width: 790px;
	}
}
@media only screen and (max-width: 790px) {
	.home-container {
		max-width: 395px;
	}
	.h1--home-title {
		font-size:42px;
	}
}

@media only screen and (max-width: 500px) {
	.home-container {
		max-width: 320px;
	}
	.container--header {
		    margin: 60px auto 40px auto;
	}
	.header-details-container p {
		color: white;
		padding: 0 0;
	}
	.header-image {
	    background-size: 500px 340px;
	    width: 100%;
	    height: 500px;
	    left:0;
	    bottom: 0;
		top: 66px;
	}
	.container--full-screen {
		min-height: 500px;
		margin-top: 66px;
		background-color: #0e0e0e;
		z-index: -1;
		padding:0 20px;
	}
}

@media only screen and (max-width: 500px) {
	.content {
		padding: 80px 0 0 0;
	}
}
@media screen and (max-height: 690px) and (min-width: 320px) {
	.action_bar-share {
    	display: block;
	}
}