/* @override 
	https://the-ultimate-trailers.local/wp-content/themes/tut/blocks/trailers.css */

/* @group TRAILERS */

.section.trailers {
	background: #3d3d3d;
	background: linear-gradient(180deg, rgba(61,61,61,1) 68%, rgba(0,0,0,1) 100%);
	padding: 8em 0;
	color: }

	.acf-block-preview .section.trailers {
		padding:0;
		font-size: .5rem !important; }
	
.section.trailers .content {
	width: 98%;
	max-width: 1300px;
	display: flex;
	flex-flow: row;
	justify-content: center;
    align-items: flex-start; }

	.acf-block-preview .section.trailers .content {
		width: auto;
		max-width: auto; }
	
.section.trailers .trailer {
	background: #111;
	margin: 1em 1em;
	flex: 0 1 440px; }	

@media screen and (max-width: 880px) {
	body.single .section.trailers .content {
	text-align: center;}
}
	
.section.trailers .trailer .model {
	padding: 1em 1.3em 1.4em 1.9em;
	display: flex;
	align-items: center; }	
	
.section.trailers .trailer .model p:not(.button) {
	color: #fff;
	flex: 1 1 auto;
/* 	max-width: 100px; */
	margin: 0px 14px 2px 0;
	font-size: 2.4em;
	line-height: .9em;}

.section.trailers .trailer .model p em {
	font-family: 'tex', serif;
	font-style: normal;
	font-size: .6em;
	display: block;}

.section.trailers .trailer .model p span {
	font-family: 'tex', serif;
	font-size: .5em;
	line-height: 1.4em;
	display: inline;
	margin-top: -1px;
	margin-right: 2px;
	float: left;}
	
.section.trailers .trailer .model h3 {
	flex: 0 1 auto;
	font-size: 4.2em;
	line-height: 1em;
	margin: 0 18px 0 0;
	padding: 0; }

	body.home .section.trailers .trailer .model h3 {
		flex: 1 1 auto; }

.section.trailers .trailer .model h3,
.section.trailers .trailer .model h3 a:link,
.section.trailers .trailer .model h3 a:visited {
	color: #fff;
	text-decoration: none;
	font-weight: 700; }
	
.section.trailers .trailer .model h3 a:hover {
	text-decoration: none;
	color: #d5000a;}

@media screen and (max-width: 1250px) {
    
	.section.trailers .trailer .model {
		flex-flow: row wrap;
		padding: 1.6em .3em 1.4em 1.9em;	}
	
	.section.trailers .trailer .model h3 {
		width: 100%;}
	
	.section.trailers .trailer .model p:not(.button) {
		flex: 0 1 auto; }
}

@media screen and (max-width: 920px) {

	.section.trailers .content {
		flex-flow: column;  }
	
	.section.trailers .trailer {
        width: 100%;
		margin: 2em 0;}	
    
    .section.trailers .trailer .model {
         padding: 2em 1.3em .4em 1.9em;
         justify-content: center; }	
    
    body.single .section.trailers .trailer .model h3 {
		display: none;}
    
    .section.trailers .trailer .model h3 {
        text-align: center;}
    
    .section.trailers .content img {
        float: none;
        display: block;
        margin: 0 auto;
        text-align: center;}
    
    .deck_size {
        text-align: center;
        padding: .5em;  }
    
}

.deck_size {
	color: #fff;
	padding: 1.3em 1em 1em 2em;
	font-variant: small-caps;}

.deck_size h5 {
	font-weight: 600;
	font-size: 2.42em;
	line-height: 1.2em; }

.deck_size ul {
	color: #ccc;
	font-size: 2.2em;
	line-height: 1.4em;
	list-style: none;
	margin: .2em 0 .6em .8em;
	padding: 0; }

	.acf-block-preview .deck_size ul,	
	.acf-block-preview .deck_size h5 {
		font-size: 1.2em;
		margin: 0; 
		padding: 0; }

	.acf-block-preview .deck_size ul {
		margin-left: 20px; }

.deck_size ul li {
	line-height: 1.0em;
	padding: 4px 0;
	text-indent: -17px; }

.deck_size ul li:before {
	content: "-";
	margin-right: 3px; }

.section.trailers p.button {
	margin-top: 13px; }

.section.trailers p.button.optional a {
	background: #999;
	color: #000;}

.section.trailers p.button.optional a:hover {
	background: #777; }

	.acf-block-preview  .section.trailers .trailer .model p.button.optional,
	.acf-block-preview  .section.trailers .trailer .model p.button {
		display: none; }

/* PHONE */

.section.trailers h6 {
	color: #fff;
	text-align: center;
	font-size: 2em;
	margin-top: 2em;
	margin-bottom: .3em; }

.section.trailers ul.widget_text.phone {
	list-style: none;
	margin: 0;
	font-weight: 700;
	text-align: center;
	font-size: 2.5em; }

.section.trailers ul.widget_text.phone a:link,
.section.trailers ul.widget_text.phone a:visited {
	color: #fff;
	text-decoration: none;
	padding-bottom: 2px;
	border-bottom: 4px solid #d6000a; }

.section.trailers ul.widget_text.phone a:hover {
	color: #ccc; }

	.acf-block-preview .section.trailers h6 {
		font-size: 1.3em;
		margin-top: 0em;
		margin-bottom: 0em; }

	.acf-block-preview .section.trailers ul.widget_text.phone {
		font-size: 1.5em; }