/*###########################################################################################################################################################################
##################################################### RESET #################################################################################################################
###########################################################################################################################################################################*/

html, body, div, p, a, h1,
h2, h3, h4, table, th, td, tr, ul,
li, img, span, hr, button
{ padding: 0;
margin: 0; }

.clearboth
{ clear: both; }

video::-webkit-media-controls 
{display: none !important}

.checkDiv {float:left;}

/*###########################################################################################################################################################################
##################################################### BASICS ################################################################################################################
###########################################################################################################################################################################*/

body
{ background-color: #0c0405;
font-family: 'Economica', sans-serif;
text-rendering: geometricPrecision;
overflow-x: hidden;  }

::selection {
	background: rgb(44, 18, 19); /* Safari */
	color: white;}
::-moz-selection {
	background: rgb(44, 18, 19); /* Firefox */
	color: white;}
	
.container
{ width: 1024px;
max-width: 90%;
margin: 0 auto; }

h2
{ text-transform: uppercase;
color: white;
font-size: 36pt; }

h3
{ color: #eeeeee;
text-shadow: 0px 2px 1px rgba(36, 36, 36, 1);
font-size: 32pt; }

/*###########################################################################################################################################################################
##################################################### HEADER ################################################################################################################
###########################################################################################################################################################################*/

#header
{ width: 100%;
float: left;
height: 800px; }

#videocontainer
{ position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -10;
width: 100%;
display: block;
height: auto !important;
background-color: #3b2d21;}

#videocontainer video, #videocontainer object img
{ width: 100%; }

#ttpresents
{ display: block;
margin: 28px auto; }

@media screen and (max-width: 1300px) {
    #ttpresents
	{ display: block;
	width: 180px; }
}

@media screen and (max-width: 1100px) {
    #ttpresents
	{ display: block;
	width: 120px; }
}


/*###########################################################################################################################################################################
##################################################### MAIN ##################################################################################################################
###########################################################################################################################################################################*/

#main
{ display: block;
background: url("../../images/mainbg_top.png"), url("../../images/mainbg_bottom.jpg");
background-position: center 0px, center 350px;
background-repeat: no-repeat;
background-color: transparent;
position: relative;
width: 100%;
left: 0;
height: auto !important; 
float: left;}

#tagline
{ width: 1024px;
max-width: 100%; }

.reviewquote
{ display: block;
width: 100%;
text-align: center;
text-decoration: none;
margin-top: 6px;
margin-bottom:20px;
text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.6); }

.reviewquote:hover
{ opacity: 0.8; }

.reviewquote:active
{ opacity: 1.0; }

.reviewcontent
{ color: #DAD1C1;
font-style: italic;
font-weight: 700;
font-size: 26pt; }

.revieworigin
{ color: #e0ccc4;
font-size: 20pt; }


#trailer
{ margin-top:85px;
max-width: 100%;
border: 2px solid #979797;
-webkit-box-shadow: 0px 0px 20px 0px rgba(50, 50, 50, 0.99);
-moz-box-shadow:    0px 0px 20px 0px rgba(50, 50, 50, 0.99);
box-shadow:         0px 0px 20px 0px rgba(50, 50, 50, 0.99); }

#comingsoon
{ width: 1024px;
max-width: 100%;
margin-top: 30px;
text-shadow: 0px 2px 3px rgba(0, 0, 0, 1);
-webkit-text-stroke: 0.8px #4E4F51;
text-align: center;
height: 207px;
padding: 25px 0px 10px 0px;
background: url("../../images/cs_highlight.png") no-repeat;
background-size: 100% 232px;
background-position: 50% 0px; }

.platformlink
{ text-decoration: none;
-webkit-text-stroke: 0.8px #4E4F51;
color: #fb2258; }

.platformlink:hover
{ opacity: 0.8; }

.platformlink:active
{ opacity: 1.0; }

#platformsimage
{ max-width: 100%;
width: 1024px; }

#talkingpoints
{ width: 100%;
border-style: none;
padding-bottom: 30px; }

.talkingpoint
{ clear: both;
padding-top: 20px;}

.vidwrap
{ width: 45%;
height: 300px;
max-width: 100%;
position: relative;
z-index: 1;
float: left; }

.textspace
{ width: 45%;
max-width: 100%; 
float: left;
margin-bottom: 20px;
margin-top: -6px;
text-shadow: 0px 2px 1px rgba(36, 36, 36, 1);}

.talkingpointvideo
{ border: 2px solid #979797;
width: 100%; 
max-width: 100%;
-webkit-box-shadow: 0px 0px 7px 0px rgba(50, 50, 50, 0.99);
-moz-box-shadow:    0px 0px 7px 0px rgba(50, 50, 50, 0.99);
box-shadow:         0px 0px 7px 0px rgba(50, 50, 50, 0.99); }

.playmobile
{ position: absolute;
margin: auto auto;
left: 2;
right: 0;
bottom: 0;
top: 2;
z-index: 10;
margin-top: -30px;
display: none; 
width: 100%; height: 100%;}

.show_play
{ display: block; }

.textspace p
{ font-size: 20pt; 
color: #fefefe; }

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

	#header { height: 400px; }
	
	.checkDiv {float:none;}
	
    .vidwrap
	{ width: 100%;
	height: 100%;
	max-width: 100%;
	position: relative;
	z-index: 1;
	float: left; 
	margin-bottom: -10px;}

	.textspace
	{ width: 100%;
	max-width: 100%; 
	float: left;
	margin-bottom: 45px;
	margin-top: 20px;
	padding: 0 !important;}
	
}

@media screen and (max-device-width: 640px){
	#header { height: 400px; }
	
	.checkDiv {float:none;}
	
    .vidwrap
	{ width: 100%;
	height: 100%;
	max-width: 100%;
	position: relative;
	z-index: 1;
	float: left; 
	margin-bottom: -10px;}

	.textspace
	{ width: 100%;
	max-width: 100%; 
	float: left;
	margin-bottom: 45px;
	margin-top: 20px;
	padding: 0 !important;}
}

/*###########################################################################################################################################################################
##################################################### FOOTER ################################################################################################################
###########################################################################################################################################################################*/

#footer
{ width: 100%; 
display: block;
float: left;
height: 185px;
text-align: center;
padding: 100px 0px 0px 0px;
background: url("../../images/footer_bg.png") 50% 0 no-repeat; }

#logosbottom
{ width: 100%;
max-width: 100%;
margin: 0 auto; 
text-align: center;}

#logosbottom img
{ text-decoration: none;
display: block;
margin: 0 auto; 
max-width: 80%; }

#tt, #nth
{ display: block;
margin-top: 20px; }


#stickyfooter a:hover, #logosbottom img:hover
{ opacity: 0.8; }

#stickyfooter a:active, #logosbottom img:active
{ opacity: 1.0;
position: relative;
bottom: -2px; }

#footer p
{ color: #8A8C8E;
font-size: 12pt;
font-weight:400;
margin-top: 30px; }

#stickyfooter
{ width: 340px;
height: 30px;
position: fixed;
z-index: 20;
bottom: 18px;
right: 18px;
max-width: 100%; }

#stickyfooter a
{ float: right;
opacity: 0.9;
margin-left: 30px;
display: block;
height: 24px; }

#stickyfooter a:last-child
{ margin: 0; }

.stopScrolling
{ position: absolute !important;
bottom: 10px !important;
right: 20px !important;
float: right; }

#fb
{ background-image: url("../../images/link_facebook.png"); 
display: block; 
width: 24px;}

#twitter
{ background-image: url("../../images/link_twitter.png"); 
display: block;
width: 29px; }

#presskit
{ background-image: url("../../images/link_presskit.png"); 
display: block;
width: 94px;
height: 28px !important; }

#yt
{ background-image: url("../../images/link_youtube.png"); 
display: block;
width: 24px; }