/* COLOR */

.color-highlight {
	color: #F25923;
}
.color-light {
	color: #FFFFFF;
}
.color-dark {
	color: #606060;
}

/* BACKGROUND */

.bg-image {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.bg-highlight {
	background-color: #F25923;
}
.bg-light {
	background-color: #FFFFFF;
}
.bg-dark {
	background-color: #606060;
}
.bg-overlay {
	background-color: rgba(0, 0, 0, 0.9);
}
.bg-ok {
	background-color: #4CAF50;
}

/* ICON */
.bg-icon {
	position: absolute;
	
	right: 1rem;
	top: 1rem;
	width: 5rem;
	height: 5rem;
	
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

/* GRADIENT */

/*
.grad-dark {
	background: transparent;
	background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black));
	background-image: -webkit-linear-gradient(top, transparent, black);
	background-image: -moz-linear-gradient(top, transparent, black);
	background-image: -ms-linear-gradient(top, transparent, black);
	background-image: -o-linear-gradient(top, transparent, black);
	background-image: linear-gradient(top, transparent, black);
}
*/
.grad-dark {
	opacity: 0.7;
	background: transparent;
	background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black));
	background-image: -webkit-linear-gradient(top, transparent, black);
	background-image: -moz-linear-gradient(top, transparent, black);
	background-image: -ms-linear-gradient(top, transparent, black);
	background-image: -o-linear-gradient(top, transparent, black);
	background-image: linear-gradient(top, transparent, black);
}
.grad-background {
	background: transparent;
	background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(#f7f7f7));
	background-image: -webkit-linear-gradient(top, transparent, #f7f7f7);
	background-image: -moz-linear-gradient(top, transparent, #f7f7f7);
	background-image: -ms-linear-gradient(top, transparent, #f7f7f7);
	background-image: -o-linear-gradient(top, transparent, #f7f7f7);
	background-image: linear-gradient(top, transparent, #f7f7f7);
}
.grad-light {
	background: #606060;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#606060), to(#a9a9a9));
	background-image: -webkit-linear-gradient(top, #606060, #a9a9a9);
	background-image: -moz-linear-gradient(top, #606060, #a9a9a9);
	background-image: -ms-linear-gradient(top, #606060, #a9a9a9);
	background-image: -o-linear-gradient(top, #606060, #a9a9a9);
	background-image: linear-gradient(top, #606060, #a9a9a9);
}
.grad-highlight {
	background: #f25923;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#f25923), to(#d23903));
	background-image: -webkit-linear-gradient(top, #f25923, #d23903);
	background-image: -moz-linear-gradient(top, #f25923, #d23903);
	background-image: -ms-linear-gradient(top, #f25923, #d23903);
	background-image: -o-linear-gradient(top, #f25923, #d23903);
	background-image: linear-gradient(top, #f25923, #d23903);
}
.grad-ok {
	background: #4CAF50;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#4CAF50), to(#2c8F30));
	background-image: -webkit-linear-gradient(top, #4CAF50, #2c8F30);
	background-image: -moz-linear-gradient(top, #4CAF50, #2c8F30);
	background-image: -ms-linear-gradient(top, #4CAF50, #2c8F30);
	background-image: -o-linear-gradient(top, #4CAF50, #2c8F30);
	background-image: linear-gradient(top, #4CAF50, #2c8F30);
}

/* FILTER */
.filter-blur {
	filter: blur(4px);
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px); 
	-o-filter: blur(4px); 
	-ms-filter: blur(4px); 
}

.filter-invert {
	filter: invert(0.4);
	-webkit-filter: invert(0.4);
	-moz-filter: invert(0.4); 
	-o-filter: invert(0.4); 
	-ms-filter: invert(0.4); 
}

.filter-contrast {
	filter: contrast(50%);
	-webkit-filter: contrast(50%);
	-moz-filter: contrast(50%); 
	-o-filter: contrast(50%); 
	-ms-filter: contrast(50%); 
}

/* OPACITY */
.opacity {
	opacity: 0.8;
}

/* BORDER */

.no-border {
	border: none;
}
.border-highlight {
	border: 1px solid #F25923;
}
.border-top-hightlight {
	border-top: 1px solid #F25923;
}
.border-bottom-hightlight {
	border-bottom: 1px solid #F25923;
}
.border-light {
	border: 1px soild #FFFFFF;
}
.border-left-light {
	border-left: 1px solid #FFFFFF;
}
.border-right-light {
	border-right: 1px solid #FFFFFF;
}
.border-dark {
	border: 1px soild #606060;
}


/* BUTTON */

.button {
	display: block; /* inline-block */

	text-decoration: none;
	
	cursor: pointer;
}
.button:hover {
	box-shadow: 0px 0px 2px #666666;
}
.button.big {
	padding: 10px 20px;
	font-size: 2.5rem;
}
.button.medium {
	padding: 5px 15px;
	font-size: 1.5rem;
}

/* POSITION */

.margin-top { margin-top: 2.5rem !important; }
.margin-bottom { margin-bottom: 2.5rem !important; }

.left { text-align: left !important; }
.center { text-align: center !important; }
.right { text-align: right !important; }

.float-left		{	float: left;		}
.float-right	{ float: right;		}
.float-clear	{	clear: both;		}

.align-bottom {
	position: absolute;
	bottom: 0;
}
.fit-parent {
	position: absolute;
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.table {
	display: table;
	width: 100%;
	height: 100%;
	table-layout: fixed;
}
.table-cell {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}
.fullscreen {
	position: fixed !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 100% !important;
	max-height: 100% !important;
	margin: 0 !important;
}
:-webkit-full-screen {
	position: fixed;
	width: 100%;
	top: 0;
	background: none;
}
:-ms-fullscreen {
  width: auto;
  height: auto;
  margin: auto;
}

.viewport {
	position: relative;
	overflow: hidden;
}

.no-wrap { 
	white-space: nowrap !important;
	white-space: -moz-pre-wrap !important; /* Firefox */
	white-space: -o-pre-wrap !important; /* Opera */
	white-space: pre-wrap !important; /* Chrome */
	word-wrap: break-word !important; /* IE */
}

.hide { display: none !important; }

.radius { border-radius: 0.5rem !important; }
.radius-left { 
	border-top-left-radius: 0.5rem !important;
	border-bottom-left-radius: 0.5rem !important;
}
.radius-right { 
	border-top-right-radius: 0.5rem !important;
	border-bottom-right-radius: 0.5rem !important;
}

.full-width { width: 100%; }

.space { margin-bottom: 1rem; }

.strong { font-weight: bold; }

.underline::after {
  content: "";
  background: #f25923 none repeat scroll 0 0;
  left: 0;
  top: 100%;
  height: 3px;
  position: absolute;
  width: 60px;
}
.underline-container {
	position: relative;
	margin-bottom: 1.5rem;
}

.control:hover {
	cursor: pointer;
}


a.description.color-highlight:hover { text-decoration: underline; }

/* MOVIE LICENSE ICONS */

.fa.green {
	color: #4CAF50;
}
.fa.yellow {
	color: #cccc00;
}
.fa.red {
	color: #cc0000;
}

/* ANIMATIONS */

.slide-text {
	overflow: hidden !important;
	height: auto !important;
	max-height: 0rem;
}
div:hover > .scale {
	transform: scale(1.1);
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
}
.transition-all {
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
}


.title {
	font-size: 3rem;
}
.title.big {
	font-size: 4rem;
}
.title.medium {
	font-size: 2rem;
}
.title.small {
	font-size: 1.5rem;
}
.title.tiny {
	font-size: 0.75rem;
}

.description {
	font-size: 1.5rem;
}
.description.big {
	font-size: 1.75rem;
}
.description.medium {
	font-size: 1.25rem;
}
.description.small {
	font-size: 1.15rem;
}
.description.tiny {
	font-size: 0.5rem;
}
.teaser {
	display: inline-block;
	
	font-size: 2rem;
	text-transform: uppercase;
	
	padding: 0.5rem 1rem 0.3rem;
}
.teaser.color-dark {
	text-transform: none;
	padding: 0.5rem 0rem 0.3rem;
}
.teaser.big {
	font-size: 3rem;
}
.teaser.medium {
	font-size: 1.5rem;
}
.teaser.small {
	font-size: 1.25rem;
}
.teaser.tiny {
	font-size: 0.75rem;
}



.date {
	display: inline-block;
	font-size: 1.5rem;
}
.date.small {
	font-size: 1.2rem;
}
.label {
	font-size: 2rem;
}
.fa.big {
	font-size: 15rem;
}
.fa.medium {
	font-size: 10rem;
}
.fa.small {
	font-size: 7rem;
}
.fa.tiny {
	font-size: 3rem;
}
.trailer {
	opacity: 0.25;
	cursor: pointer;
}
.trailer:hover {
	opacity: 0.7;
}
.trailer .play {
	position: absolute;
	top: 50%;
	left: 50%;
	color: rgba(255, 255, 255, 0.75);
}
.trailer .play.big {
	margin-top: -7.5rem;
	margin-left: -6rem;
}
.trailer .play.medium{
	margin-top: -5rem;
	margin-left: -4rem;
}
.trailer .play.small {
	margin-top: -3.5rem;
	margin-left: -2.5rem;
}

/* EXPANDABLE TEXT */

.expandable-text {
	position: relative;
}
.expandable-text.expandable {
	padding-bottom: 3rem;
}
.expandable-text .expand {
	max-height: 10.5rem;
	height: auto;
	overflow: hidden;
}
.expandable-text .control {
	background-color: #e9e9e9;
	bottom: 0;
	display: block;
	font-size: 2rem;
	position: absolute;
	line-height: 1.4;
}

@media (min-width: 1301px) {
	
}

/* breakpoint definition - desktop lowres */
@media (max-width: 1300px) and (min-width: 1008px) {

	
}

/* breakpoint definition - tablet */
@media (max-width: 1007px) { 
	
	.title {
		font-size: 2.5rem;
	}
	.title.big {
		font-size: 3rem;
	}
	.title.medium {
		font-size: 1.75rem;
	}
	.title.small {
		font-size: 1.5rem;
	}
	.title.tiny {
		font-size: 0.75rem;
	}
	
	.teaser {
		font-size: 1.75rem;
	}
	.teaser.big {
		font-size: 2.5rem;
	}
	.teaser.medium {
		font-size: 1.5rem;
	}
	.teaser.small {
		font-size: 1.25rem;
	}
	.teaser.tiny {
		font-size: 0.75rem;
	}
	
	.description {
		font-size: 1.5rem;
	}
	.description.big {
		font-size: 1.5rem;
	}
	.description.medium {
		font-size: 1.25rem;
	}
	.description.small {
		font-size: 1.15rem;
	}
	.description.tiny {
		font-size: 0.5rem;
	}
	
	.fa.big {
		font-size: 10rem;
	}
	.fa.medium {
		font-size: 10rem;
	}
	.fa.small {
		font-size: 7rem;
	}
	.fa.tiny {
		font-size: 3rem;
	}
	.trailer .play.big {
		margin-top: -5rem;
		margin-left: -4rem;
	}
	.trailer .play.medium{
		margin-top: -5rem;
		margin-left: -4rem;
	}
	.trailer .play.small {
		margin-top: -3.5rem;
		margin-left: -2.5rem;
	}
}

/* breakpoint definition - menu */
@media (max-width: 870px) {
	
}

/* breakpoint definition - mobile */
@media (max-width: 599px) {
	
	.title {
		font-size: 2rem;
	}
	.title.big {
		font-size: 2.5rem;
	}
	.title.medium {
		font-size: 1.5rem;
	}
	.title.small {
		font-size: 1.25rem;
	}
	.title.tiny {
		font-size: 0.75rem;
	}
	
	.teaser {
		font-size: 1.5rem;
	}
	.teaser.big {
		font-size: 2rem;
	}
	.teaser.medium {
		font-size: 1.5rem;
	}
	.teaser.small {
		font-size: 1.25rem;
	}
	.teaser.tiny {
		font-size: 0.75rem;
	}
	
	.description {
		font-size: 1.25rem;
	}
	.description.big {
		font-size: 1.5rem;
	}
	.description.medium {
		font-size: 1.25rem;
	}
	.description.small {
		font-size: 1.15rem;
	}
	.description.tiny {
		font-size: 0.5rem;
	}
	
	.margin-top { margin-top: 1.5rem !important; }
	.margin-bottom { margin-bottom: 1.5rem !important; }
	
	.underline-container {
		margin-bottom: 1rem;
	}
	
	.label {
		font-size: 1.5rem;
	}
	
	.fa.big {
		font-size: 7rem;
	}
	.fa.medium {
		font-size: 7rem;
	}
	.fa.small {
		font-size: 7rem;
	}
	.fa.tiny {
		font-size: 3rem;
	}
	.trailer .play.big {
		margin-top: -3.5rem;
		margin-left: -2.5rem;
	}
	.trailer .play.medium{
		margin-top: -3.5rem;
		margin-left: -2.5rem;
	}
	.trailer .play.small {
		margin-top: -3.5rem;
		margin-left: -2.5rem;
	}
	
}

/* breakpoint definition - two lines */
@media (max-width: 520px) {
	
	
	
}

@media (max-width: 360px) {
	
	.title {
		font-size: 2rem;
	}
	.title.big {
		font-size: 2rem;
	}
	.title.medium {
		font-size: 1.5rem;
	}
	.title.small {
		font-size: 1.25rem;
	}
	.title.tiny {
		font-size: 0.75rem;
	}
	
	.teaser {
		font-size: 1.5rem;
	}
	.teaser.big {
		font-size: 1.5rem;
	}
	.teaser.medium {
		font-size: 1.5rem;
	}
	.teaser.small {
		font-size: 1.25rem;
	}
	.teaser.tiny {
		font-size: 0.75rem;
	}
	
	.description {
		font-size: 1.25rem;
	}
	.description.big {
		font-size: 1.5rem;
	}
	.description.medium {
		font-size: 1.25rem;
	}
	.description.small {
		font-size: 1.15rem;
	}
	.description.tiny {
		font-size: 0.5rem;
	}
	
	
	
}