/* 
 ************************************************** 
 * Blocks
 */
@media screen and (min-width: 768px) {
	 .blocks {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: stretch;
		margin: 0 -7px;
	}
}

.blocks .item {
    display: flex;
    flex-basis: 33.333%;
    flex-direction: column;
	align-items: stretch;
    margin-bottom: 1.333em;
}

.blocks .item > div {
    height: 100%;
    display: flex;
    flex-direction: column;
	padding: 1.333em;
	padding-bottom: calc(1.333em + 8px);
	margin: 0 7px
}

.blocks-clear .item > div {
	padding-right: inherit;
	padding-left: inherit;
}
	
.blocks .item > div,
.blocks .item > div:after {
	border-radius: .25em
}

.blocks .item img {
	max-width: 100%;
	object-fit: contain
}

.blocks .item h2 {margin-top: 0}

.blocks .item-cta {
    margin: 0;
    margin-top: auto;
}

.blocks-arrow .item,
.blocks-point .item {
	display: flex;
	margin-bottom: calc(1.333em + 7px)
}

.blocks-arrow .item > div,
.blocks-point .item > div {
	border-radius: .25em .25em 0 0
}

.blocks .item > img {
	display: block;
	flex-shrink: 0;
	max-width: 100%;
	height: auto;
	margin: -1px 7px 0;
}

@media screen and (min-width: 768px) {
    .blocks {
        flex-direction: row;
        flex-wrap: wrap
    }
    .blocks .item {
        display: flex;
		margin-bottom: 14px;
    }
    .blocks .item {flex-basis: 50%}
	.blocks-arrow .item,
	.blocks-point .item {
		display: flex;
		margin-bottom: calc(2.666em + 7px)
	}
}

@media screen and (min-width: 768px) {
	.blocks {justify-content: flex-start}
	.blocks .item {flex-basis: 50%}
}

@media screen and (min-width: 992px) {
	.blocks-3 .item {flex-basis: 33.3333%}
	.blocks-4 .item {flex-basis: 25%; min-width: 238px}
	.blocks-5 .item {flex-basis: 33.333%; min-width: 228px}
	.blocks-6 .item {flex-basis: 33.3333%; min-width: 190px}
}

@media screen and (min-width: 1200px) {
	.blocks-5 .item {flex-basis: 20%; min-width: 228px}
	.blocks-6 .item {flex-basis: 16.6666%; min-width: 190px}
}



/* 
 ************************************************** 
 * Blocks: Feature
 */

 .blocks-feature .feature {
	background: #000;
	flex: auto;
	min-height: auto;
	height: auto;
}

.blocks-feature .feature .item {
    width: 100%;
	align-self: center;
	justify-content: center;
}

@media screen and (min-width: 992px)  {
	.blocks-feature .feature .item {
		height: 200px;
		min-height: 200px;
	}
	.blocks-feature .feature h2 {font-size: 2.133em}
}

.blocks-feature .feature:hover,
.blocks-feature .feature:focus {
	background-color: #782f40
}


/* 
 ************************************************** 
 * Blocks: Zigzag (Saw)
 */
.s3-z-c, .s3-z-w, .s3-z-n2w, .s3-z-n1w, .s3-z-n, .s3-z-n2s, .s3-z-s, .s3-z-k, .s3-z-gt, .s3-z-gd, .s3-z-gd1c, .s3-z-gd2c, .s3-z-gd3c {
    border-bottom: none;
    position: relative;
}

.s3-z-c:after, .s3-z-w:after, .s3-z-n2w:after, .s3-z-n1w:after, .s3-z-n:after, .s3-z-n2s:after, .s3-z-s:after, .s3-z-k:after, .s3-z-gt:after, .s3-z-gd:after, .s3-z-gd1c:after, .s3-z-gd2c:after, .s3-z-gd3c:after {
    display: block;
    width: 100%;
    height: 12px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-position: left;
    background-repeat: repeat-x;
    background-size: 18px 12px;
	content: "";
	margin: 0;
}

.s3-z-c:after    {background-image: linear-gradient(-30deg, #F4F4F7 8px, transparent 0), linear-gradient(30deg, #F4F4F7 8px, transparent 0)}
.s3-z-w:after    {background-image: linear-gradient(-30deg, #f4f4f4 8px, transparent 0), linear-gradient(30deg, #f4f4f4 8px, transparent 0)}
.s3-z-n2w:after  {background-image: linear-gradient(-30deg, #d5d4d4 8px, transparent 0), linear-gradient(30deg, #d5d4d4 8px, transparent 0)}
.s3-z-n1w:after  {background-image: linear-gradient(-30deg, #b5b5b4 8px, transparent 0), linear-gradient(30deg, #b5b5b4 8px, transparent 0)}
.s3-z-n:after    {background-image: linear-gradient(-30deg, #969594 8px, transparent 0), linear-gradient(30deg, #969594 8px, transparent 0)}
.s3-z-n2s:after  {background-image: linear-gradient(-30deg, #565554 8px, transparent 0), linear-gradient(30deg, #565554 8px, transparent 0)}
.s3-z-s:after    {background-image: linear-gradient(-30deg, #2c2a29 8px, transparent 0), linear-gradient(30deg, #2c2a29 8px, transparent 0)}
.s3-z-k:after    {background-image: linear-gradient(-30deg, #161514 8px, transparent 0), linear-gradient(30deg, #161514 8px, transparent 0)}
.s3-z-gt:after   {background-image: linear-gradient(-30deg, #782f40 8px, transparent 0), linear-gradient(30deg, #782f40 8px, transparent 0)}
.s3-z-gd:after   {background-image: linear-gradient(-30deg, #ceb888 8px, transparent 0), linear-gradient(30deg, #ceb888 8px, transparent 0)}
.s3-z-gd1c:after {background-image: linear-gradient(-30deg, #dacaa6 8px, transparent 0), linear-gradient(30deg, #dacaa6 8px, transparent 0)}
.s3-z-gd2c:after {background-image: linear-gradient(-30deg, #e7dcc4 8px, transparent 0), linear-gradient(30deg, #e7dcc4 8px, transparent 0)}
.s3-z-gd3c:after {background-image: linear-gradient(-30deg, #f3ede1 8px, transparent 0), linear-gradient(30deg, #f3ede1 8px, transparent 0)}

/* Blocks: Zigzag: Small */
.s3-z-sm-c:after, .s3-z-sm-w:after, .s3-z-sm-n2w:after, .s3-z-sm-n1w:after, .s3-z-sm-n:after, .s3-z-sm-n2s:after, .s3-z-sm-s:after, .s3-z-sm-k:after, .s3-z-sm-gt:after, .s3-z-sm-gd:after, .s3-z-sm-gd1c:after, .s3-z-sm-gd2c:after, .s3-z-sm-gd3c:after {
    display: block;
    width: 100%;
    height: 6px;
    position: absolute;
    bottom: 0;
    left: 0;
    background-position: bottom;
    background-repeat: repeat-x;
    background-size: 8px 6px;
    content: " ";
}

.s3-z-sm-c:after    {background-image: linear-gradient(-30deg, #F4F4F7f 4px, transparent 0), linear-gradient(30deg, #F4F4F7 4px, transparent 0)}
.s3-z-sm-w:after    {background-image: linear-gradient(-30deg, #f4f4f4 4px, transparent 0), linear-gradient(30deg, #f4f4f4 4px, transparent 0)}
.s3-z-sm-n2w:after  {background-image: linear-gradient(-30deg, #d5d4d4 4px, transparent 0), linear-gradient(30deg, #d5d4d4 4px, transparent 0)}
.s3-z-sm-n1w:after  {background-image: linear-gradient(-30deg, #b5b5b4 4px, transparent 0), linear-gradient(30deg, #b5b5b4 4px, transparent 0)}
.s3-z-sm-n:after    {background-image: linear-gradient(-30deg, #969594 4px, transparent 0), linear-gradient(30deg, #969594 4px, transparent 0)}
.s3-z-sm-n2s:after  {background-image: linear-gradient(-30deg, #565554 4px, transparent 0), linear-gradient(30deg, #565554 4px, transparent 0)}
.s3-z-sm-s:after    {background-image: linear-gradient(-30deg, #2c2a29 4px, transparent 0), linear-gradient(30deg, #2c2a29 4px, transparent 0)}
.s3-z-sm-k:after    {background-image: linear-gradient(-30deg, #161514 4px, transparent 0), linear-gradient(30deg, #161514 4px, transparent 0)}
.s3-z-sm-gt:after   {background-image: linear-gradient(-30deg, #782f40 4px, transparent 0), linear-gradient(30deg, #782f40 4px, transparent 0)}
.s3-z-sm-gd:after   {background-image: linear-gradient(-30deg, #ceb888 4px, transparent 0), linear-gradient(30deg, #ceb888 4px, transparent 0)}
.s3-z-sm-gd1c:after {background-image: linear-gradient(-30deg, #dacaa6 4px, transparent 0), linear-gradient(30deg, #dacaa6 4px, transparent 0)}
.s3-z-sm-gd2c:after {background-image: linear-gradient(-30deg, #e7dcc4 4px, transparent 0), linear-gradient(30deg, #e7dcc4 4px, transparent 0)}
.s3-z-sm-gd3c:after {background-image: linear-gradient(-30deg, #f3ede1 4px, transparent 0), linear-gradient(30deg, #f3ede1 4px, transparent 0)}

/* 
 ************************************************** 
 * Blocks: Feature
 */

 .blocks-feature .feature {
	background: #000;
	flex: auto;
	min-height: auto;
	height: auto;
}

.blocks-feature .feature .item {
    width: 100%;
	align-self: center;
	justify-content: center;
}

@media screen and (min-width: 992px)  {
	.blocks-feature .feature .item {
		height: 200px;
		min-height: 200px;
	}
	.blocks-feature .feature h2 {font-size: 2.133em}
}

.blocks-feature .feature:hover,
.blocks-feature .feature:focus {
	background-color: #782f40
}

/* 
 ************************************************** 
 * Features
 */
a .feature {color: #fff; text-shadow: 3px 3px 0px #000;}
a:hover .feature, a:focus .feature                             {color: #fff; text-shadow: none}
a:hover .feature:after, a:focus .feature:after                 {background: #782f40}
a:hover .feature-dark:after,   a:focus .feature-dark:after     {background: #2c2a29}
a:hover .feature-darker:after, a:focus .feature-darker:after   {background: #000}
a:hover .feature-light,   a:focus .feature-light,
a:hover .feature-lighter, a:focus .feature-lighter             {color: #000}
a:hover .feature-light:after,   a:focus .feature-light:after   {background: #ceb888}
a:hover .feature-lighter:after, a:focus .feature-lighter:after {background: #e7dcc4}

.container-fluid .feature {
	margin-right: -14px;
	margin-left: -14px;
}

.feature {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	background-repeat: no-repeat;
	background-repeat: no-repeat;
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	background-size: cover !important;
	object-fit: cover;
	text-align: center;
	margin-bottom: 1em;
	align-items: center;
	min-height: 240px;
}

@media screen and (min-width: 768px)  {
	.feature {
		min-height: 420px;
		margin-bottom: 0;
	}
}

.feature-fixed,
.feature-static,
.feature-video {
	background-color: #000;
	color: #fff;
	text-shadow: 3px 3px 0px #000;
}
  
.feature:after,
.feature .video-container:after {
  display: block;
  z-index: 1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 5;
}

.feature-dark .item, .feature-darker .item {color: #fff; text-shadow: none}
.feature-dark:after,
.feature-dark .video-container:after {background: rgba(0, 0, 0, 0.50)}
.feature-darker:after,
.feature-darker .video-container:after {background: rgba(0, 0, 0, 0.75)}

.feature-light .item, .feature-lighter .item {color: #000; text-shadow: none}
.feature-light:after, 
.feature-light .video-container:after {background: rgba(255, 255, 255, 0.50)}
.feature-lighter:after, 
.feature-lighter .video-container:after {background: rgba(255, 255, 255, 0.75)}

.feature-light .video-btn,
.feature-lighter .video-btn {
	color: #000;
	border-color: #000;
}

.feature .item {
	align-self: center;
	padding: 20px;
	margin: 0 20px;
	z-index: 10
}

.feature h2 { 
	font-size: 2.369em;
	line-height: 1.1;
	margin: 0
}

.feature p {font-size: 1.777rem}
.feature .lead {font-size: 2.13287rem}
.feature .small {font-size: 1.333rem}
@media screen and (min-width: 768px)  {
	.feature {min-height: 360px; height: 360px}
}

@media screen and (min-width: 992px)  {
	.feature {min-height: 420px; height: 420px}
	.feature h2 {font-size: 3.157em}
	.feature .h3 {font-size: 2.369em}
	.feature .h4 {font-size: 2.133em}
	.feature .h5 {font-size: 1.777em}
	.feature .h6 {font-size: 1.333em}
}

@media screen and (min-width: 1200px) {
	.feature {min-height: 540px; height: 540px}
	.feature h2 {font-size: 4.209em}
	.feature .h3 {font-size: 3.157em}
	.feature .h4 {font-size: 2.133em}
	.feature .h5 {font-size: 1.777em}
	.feature .h6 {font-size: 1.000em}
}

@media screen and (min-width: 1920px) {
	.container-fluid .feature {min-height: 720px; height: 720px}
}

@media screen and (min-width: 768px) {
	.feature-left {
		justify-content: flex-start;
		text-align: left
	}

	.feature-right {
		justify-content: flex-end;
    	text-align: right
	}
  
	.feature-left .item {
		max-width: calc(50% - 40px)
	}
	.feature-left .item {text-align: left}

	.feature-right .item {
		max-width: calc(50% - 40px);
		text-align: right;
	}
}

.feature-fixed {
	background-attachment: scroll
}

@media screen and (min-width: 768px) {
	.feature-fixed {
		background-attachment: fixed
	}
}

.feature-hero {
	display: flex;
	flex-direction: column
}

.feature-hero .item-image {
	padding: 0;
	margin: 0
}

@media screen and (min-width: 768px) {
	.feature-hero {
		flex-direction: row;
		min-height: auto;
		height: auto
	}
	.feature-hero .item {
		flex: 1;
	}
	.feature-hero .item-first {order: -1}
	.feature-hero .item-image {
		max-width: 50%;
		margin: 0 auto;
	}
	.feature-hero .item-text {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}

.feature-video {
	background-color: #000;
	color: #fff;
	min-width: 100%;
	overflow: hidden;
}

.feature-video video {transition: 1s opacity}
.feature-video .videofade {opacity: .5}
@media screen and (max-width: 767px) {
	.feature-video video {display: none}
}
@media screen and (min-width: 768px) {
  .feature-video {background-image: none !important}
}

.feature-video .video-container {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: 100%; 
	overflow: hidden;
	z-index: 2;
}

.feature-video video {
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	z-index: 1;
}

.feature-video .video-controls {display: none}

@media screen and (min-width: 768px) {
	.feature-video .video-controls {
		position: absolute;
		right: 0;
		bottom: 0;
		z-index: 5;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		min-width: 5em;
		height: 3em;
		padding: 0 8px;
		z-index: 6
	}

	.feature-video .video-controls button {
		display: inline-block;
		background: transparent;
		color: #fff;
		width: 1.5em;
		height: 1.5em;
		font-size: 1.5em;
		line-height: 1.5em;
		border: 0;
		cursor: pointer;
		z-index: 10;
		opacity: 0.5
	}

	.feature-video .video-controls button:hover,
	.feature-video .video-controls button:focus {opacity: 1}
}