/*------------------------------------------------------------------
Company Name /  global.css

Author:			Karl Norling	<karl@form-studios.com>

Methods: 		1. 	CSS FILES ORGANISATION 
					global.css			->	 	global rules
						fontsizes/*.css		->		main measurements files
					home.css			->		rules for homepage
					interior.css		->		rules for interior pages
							
				
				2.	IN THIS CSS FILE:
					General Rules
					Form Elements (appearance settings only)
					#container
						#header
							#logo
							#mainnav
						#body
							global elements for #body	
							column settings for #body						
						#footer
					Workarounds
--------------------------------------------------------------------*/

/* default measurement 1em = 10px*/
@import url(fontsizes/x-small.css);



 /* GENERAL RULES
--------------------------------------------------------------------*/

* {
	/*overwrite all default browser settings*/
	margin:				0;
	padding:			0;
	
	/*global font settings*/
	font-family: 		arial,helvetica,sans-serif;
}

html,body {
	/*part 1 of 100% height hack*/
	height:				100%;
}

body {
	background: 		#111;
	padding:			0;
	margin:				0;
	
	/*part 1 of centering hack*/
	text-align: 		center;	
}


 /* Global Link Settings
--------------------------------*/
a {
	color:				#009FED;
	text-decoration:	none;
}
a:visited {
	
}
a:hover, 
a:active {
	text-decoration:	underline;
}

/* OL-7515 */
.arrow a { text-decoration: none; color: transparent; }
/* OL-7516 */
#logo a { text-decoration: none; color: transparent; }


 /* General Elements
--------------------------------*/

img {
	display: 			block; /*to avoid IE 3px bug, keep or delete, can be used with .float-left/right*/
	border:				0;
}

 /* Good to have global classes
--------------------------------*/
.floatright {
	float: 				right;
	display:			inline; /*to avoid IE double margin bug*/
}
.floatleft {
	float: 				left;
	display:			inline; /*to avoid IE double margin bug*/
}
.alignright {
	text-align:			right;
}

/*e.g. for accessibility quick links*/
.hide {
	height: 			0;
	width: 				0;
	overflow: 			hidden;
	position: 			absolute;
}


 /* Global Form Elements (appearance only, no layout settings etc)
--------------------------------*/
label {
	
}

input.type_submit {
	
}
input.type_text,
textarea.type_text  {
	
}
label.type_checkradio {
	
}
select {
	
}

 /* MAIN CONTAINER
--------------------------------------------------------------------*/
#container {
	max-width: 			90em;
	width:				900px;
	min-width:			90em;
	
	padding:			0;
	
	/*part 2 of centering hack*/
	text-align: 		left;
	margin: 			0 auto;
	background:			#fff;
}

html>body #container {
/*part 3 of 100% height hack*/
    height: 			auto;
}


 /* HEADER
--------------------------------------------------------------------*/
#header {
	position:			relative;
	height:				364px;
	background: #fff url("../img/header.jpg") top left;
	background-repeat: no-repeat;
}

#header_services{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_services.jpg") top left;
	background-repeat: no-repeat;
}

#header_technology{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_technology.jpg") top left;
	background-repeat: no-repeat;
}

#header_gallery{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_gallery.jpg") top left;
	background-repeat: no-repeat;
}

#header_aboutus{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_aboutus.jpg") top left;
	background-repeat: no-repeat;
}

#header_press{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_press.jpg") top left;
	background-repeat: no-repeat;
}

#header_contact{
	position:			relative;
	height:				205px;
	background: #fff url("../img/header_contact.jpg") top left;
	background-repeat: no-repeat;
}

#logo {
	/* background: 		url("../img/mova_logo.jpg"); */
	width:				74px;
	height:				53px;
	position: 			absolute;
	left:				797px;
	top:				6px;
}


#logo a,
#logo a:visited {
	border: 			0;
}
#logo a:hover {
	border: 			0;
}


/* Home Banner
----------------------------------------------*/
#spiderman {
	width: 674px;
	position:			relative;
	height:				364px;
	background: #fff url(../img/spiderman.jpg) top left;
	background-repeat: no-repeat;
}

#huntsman {
	width: 674px;
	position:			relative;
	height:				364px;
	background: #fff url(../img/huntsman.jpg) top left;
	background-repeat: no-repeat;
}

#avengers {
	width: 674px;
	position:			relative;
	height:				364px;
	background: #fff url(../img/avengers.jpg) top left;
	background-repeat: no-repeat;
}

#carter {
	width: 674px;
	position:			relative;
	height:				364px;
	background: #fff url(../img/carter.jpg) top left;
	background-repeat: no-repeat;
}

#hulk {
	width: 674px;
	position:			relative;
	height:				364px;
	background: #fff url(../img/hulk7.jpg) top left;
	background-repeat: no-repeat;
}

#ccbb {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/ccbb7.jpg);
	background-position: left top;
}

#percy {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/percy8.jpg);
	background-position: left top;
}

#transform {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/transform.jpg);
	background-position: left top;
}

#green{
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/green.jpg);
	background-position: left top;
}

#harry {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/harry.jpg);
	background-position: left top;
}

#tron {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/tron.jpg);
	background-position: left top;
}

#pirates {
	width: 674px;
	position:			relative;
	height:				364px;
	background-repeat: no-repeat;
	background-color: #fff;
	background-image: url(../img/pirates.jpg);
	background-position: left top;
}

.bannerbar {
	position:			absolute;
	top:				316px;
	left:				458px;
	width:				208px;
	height:				24px;
	font-size: 12px;
	color: #FFF;
	background-color: #00B0F1;
	padding: 4px;
}

 /* TAG LINE
--------------------------------------------------------------------*/
#tagline {
	position:			relative;
	top:				340px;
	left:				190px;
	width:				484px;
	height:				24px;
	background: 		#3A3A3A;
	
}


#tagline_services {
	position:			relative;
	top:				181px;
	width:				305px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}
#tagline_technology {
	position:			relative;
	top:				181px;
	width:				364px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}

#tagline_gallery {
	position:			relative;
	top:				181px;
	width:				412px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}
#tagline_aboutus {
	position:			relative;
	top:				181px;
	width:				383px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}

#tagline_press {
	position:			relative;
	top:				181px;
	width:				190px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}

#tagline_contact {
	position:			relative;
	top:				181px;
	width:				360px;
	height:				24px;
	background: 		#3A3A3A;
	z-index:			5;
}

#tagline span.arrow,
#tagline_services span.arrow,
#tagline_technology span.arrow,
#tagline_gallery span.arrow,
#tagline_gallery span.arrow,
#tagline_aboutus span.arrow,
#tagline_press span.arrow,
#tagline_contact span.arrow{
	width:				11px;
	height:				24px;
	background:			#009FED;
	float:				left;
}


#tagline_services p,
#tagline_technology p,
#tagline_gallery p,
#tagline_aboutus p,
#tagline_press p,
#tagline_contact p{
	float:				left;
	display:			inline;
	margin:				4px 0 0 23px;
	color:				#fff;
	font-size:			12px;
}

#tagline_services p a,
#tagline_technology p a,
#tagline_gallery p a,
#tagline_aboutus p a,
#tagline_press p a,
#tagline_contact p a{
	color:				#fff;
	text-decoration:	none;
}

#tagline a  {
	float:				left;
	display:			inline;
	margin:				4px 0 0 8px;
	color:				#fff;
	font-size:			12px;
	text-decoration:	none;
}

#tagline span.arrow img,
#tagline_services span.arrow img,
#tagline_technology span.arrow img,
#tagline_gallery span.arrow img,
#tagline_aboutus span.arrow img,
#tagline_press span.arrow img,
#tagline_contact span.arrow img{
	border: 			0;
}


 /* Main Nav Setup
--------------------------------*/

#mainnav {
	position: 			absolute;
	top:				67px;
	left:				784px;
	color:				#000;
	z-index:			4;
}

#mainnav li {
	text-transform: 	uppercase;
	list-style:			none;
	text-align:			right;
	font-size:			1.3em;
	line-height:		1.2em;
}
#mainnav li a,
#mainnav li a:visited {
	text-decoration: 	none;
	padding-right:		8px;
}

#mainnav li a:hover{
	text-decoration: 	underline;	
}

#mainnav li a.selected{
	color:				#000;
	background:			url("../img/black_arrow.gif") right;
	background-repeat: 	no-repeat;
}

#mainnav li ul {

}

#mainnav li ul li {
	
}

#mainnav li ul a,
#mainnav li ul a:visited {
	text-decoration: 	none;

}
 /* Page Nav Setup
--------------------------------*/

#pagenav{
	position:			absolute;
	top:				205px;
	width:				90em;
	height:				86px;
	margin: 0;
	padding: 0;
}

 /* #body - Global elements (works in all columns)
--------------------------------------------------------------------*/
#body {
	background:			#fff;
}

#body p {
	margin:				0 0 1em 0;
}

/*boxes*/
#body dl.box {
	
}
#body dl.box dt {
	
}
#body dl.box dd {
	
}

/* #body - column layouts
--------------------------------*/
#body #maincontent,
#body #local,
#body #contextual {
	float: 				left;
	display:			inline;
	color: 				#3A3A3A;
}

#body #maincontent {
	width:				644px;
	padding-left:		30px;
}

#body #maincontent_services{
	width:				675px;
	margin:				86px 0 30px 0;
	background:			url("../img/maincontent_services.jpg") top;
	background-repeat:	no-repeat;
}

#body #maincontent_technology{
	width:				675px;
	margin:				86px 0 30px 0;
	background:			url("../img/maincontent_technology.jpg") top;
	background-repeat:	no-repeat;
}

#body #maincontent_gallery{
	width:				675px;
	margin:				86px 0 30px 0;
	background:			url("../img/maincontent_gallery.jpg") top;
	background-repeat:	no-repeat;
}
#body #maincontent_aboutus{
	width:				675px;
	margin:				86px 0 30px 0;
	background:			url("../img/maincontent_aboutus.jpg") top;
	background-repeat:	no-repeat;
}

#body #maincontent_press{
	width:				675px;
	margin:				86px 0 30px 0;
	background:			url("../img/maincontent_press.jpg") top;
	background-repeat:	no-repeat;
}

#body #local {
	width:				25%;
	margin-left:		-73%; 
	background:			green;
}

#body #contextual {
	width:				175px; 
	margin:				50px 21px 0 20px;
	padding:			0 0 20px 0;
	font-size:			1.2em;
}

/*Bottom Menu Hack - Begin
#body #box_menu {
	width:				602px;
	float:				left;	
	display:			inline; 	
	margin:				0 -3px 30px 30px;
	position:			relative;
}
*/

/*Bottom Menu Hack - Begin*/
#bottommenu {
	background:			#fff;
	clear:				both;
	
}

#bottommenu li {
	padding:			15px 0 30px 30px;
	float: 				left;
	display:			inline; /*to avoid IE double margin bug*/	
	text-transform: 	uppercase;
	font-size:			1.3em;
	line-height:		1.2em;	
}
#bottommenu li a,
#bottommenu li a:visited {
	text-decoration: 	none;
	padding-right:		8px;
}

#bottommenu li a:hover {
	text-decoration: 	underline;
	//background:			url("../img/black_arrow.gif") right;
	background-repeat: 	no-repeat;
}
#bottommenu li a.selected {
	color:				#000;
	background:			url("../img/black_arrow.gif") right;
	background-repeat: 	no-repeat;
}




 /* FOOTER
--------------------------------------------------------------------*/
#footer {
	background:			#000;
	clear:				both;
	color:				#5F5F5F;
	height: 			39px;
}
#footer address  {
	padding: 			15px 0 0 19px;
	font-style:			normal;
	font-size:			1.2em;
	
}





 /* CSS Workarounds
--------------------------------------------------------------------*/

 /* clearfix (already applied on #body)
--------------------------------*/

.clearfix:after,#body:after {
    content:"."; 
    display:block; 
    height:0; 
    clear:both; 
    visibility:hidden;
}

.clearfix,#body {
	display:inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix, * html #body {height: 1%;}
.clearfix, #body {display: block;}
/* End hide from IE-mac */