@charset "UTF-8";

body {
	font:12px/20px Verdana, Geneva, Arial, Helvetica, sans-serif;
	color:#FFF;
	background-color:#000;
}

body#toppage {
	background:url("../img/background/concrete_top.jpg") 0 0 no-repeat #000;
	background-size:100%;
}

body#inner_p, body#spec {
	background:url("../img/background/concrete.jpg") 0 0 no-repeat #000;
	background-size:100%;
}

.clear {
	clear:both;
}

#toppage div#container {
	width:auto;
	max-width:1000px;
	margin:0 auto;
	position:relative;
}



div#container {
	/*background:url("../img/background-test.jpg") 0 0 no-repeat #000;*/
	-moz-background-size: 100%;
    -webkit-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    width:100%;
   	height:100%;
   	position: absolute;
}


div#video {
	width:70%;
	margin:0 auto;
	margin-top:100px;
	position: relative;
    padding-bottom: 37%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
    z-index:100;	
}

.lt-ie9 #video {
	width:65%;
    padding-bottom: 38%;
}

.lt-ie7 #video {
	width:65%;
    padding-bottom: 50%;
}


div#no_video {
	margin:0 auto;
	width:50%;	
}


div#video iframe, div#video object, div#video embed {
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index: 100;
}

div#no_video img {
	padding-top:50px;
	width:100%;
	position: relative;
	z-index: 100;
}

div#lineup {
	width:100%;
	margin-top:100px;	
	margin-bottom:20px;
}

div#lineup ul {
	padding:0;
	margin:0 20px;
	list-style:none;
}

div#lineup ul li {
	width:33%;
	float:left;
	text-align:center;
	font-weight:bold;
}

div#lineup ul li a {
	display:block;
}


div#lineup ul li img {
 	padding:0;
 	width:100%;
}

div#lineup ul li span {
	display:none;
}

div#header {

}

div#header a#logo {
	display:block;
	width:200px;
	height:200px;
	background:url("../img/logo.png") 0 0 no-repeat transparent;
	text-indent:-99999px;
	position: absolute;
	top:0;
	left:0;
	z-index:150;
}

div#header div#xx_logo_intro {
	display:block;
	width:74px;
	height:50px;
	background:url("../img/xx_logo.png") 0 0 no-repeat transparent;
	text-indent:-99999px;	
	position: absolute;
	top:23px;
	left:120px;
	z-index:250;
}

div#header ul#navi {
	height:30px;
	width:686px;
	background-color:#000;
	list-style: none;
	position:absolute;
	top:0;
	right:20px;
	/*right:100px;*/
	z-index:4000;
	margin:0;
	/*margin:0 auto;*/
	padding:0;
	/*box-shadow:0 0 7px rgba(0, 0, 0, 0.75);*/
}

div#header ul#navi li {
	float:left;
	height:30px;
}

div#header ul#navi li a {
	color:#FFF;
	text-transform:uppercase;
	text-decoration:none;
	text-align:center;
	display:block;
	height:30px;
	width:110px;
	font:10px/30px Verdana, Geneva, Arial, Helvetica, sans-serif;
	font-weight:bold;
	border-right:1px solid #595959;
}

div#header ul#navi li.last a {
	width:130px;
	text-align:center;
	border-right:none;
}

div#header ul#navi li#home a.selected, div#header ul#navi li#home a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #595959;*/
}

div#header ul#navi li#mr60 a.selected, div#header ul#navi li#mr60 a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #00a8ff;*/
}

div#header ul#navi li#sr50 a.selected, div#header ul#navi li#sr50 a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #ffc000;*/
}

div#header ul#navi li#fx102 a.selected, div#header ul#navi li#fx102 a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #05e4ec;*/
}

div#header ul#navi li#inner a.selected, div#header ul#navi li#inner a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #05ca4a;*/
}

div#header ul#navi li#spec a.selected, div#header ul#navi li#spec a:hover  {
	height:25px;
	border-bottom:5px solid #ff3721;
	/*border-bottom:5px solid #f30c84;*/
}

div#navi_cont {
	position: relative;
	top:0;
	left:0;
	z-index:5000;
}

a#pull {
	display:none;
}


div#content {
	overflow-x: hidden;
	width:100%;
	height:100%;
	min-height:800px;
	/*height:800px;*/
	position:absolute;
	z-index:10;
}

.lt-ie9 div#content {
	min-height: 900px; 
	height:auto !important; 
    height: 900px; 	
	overflow-x:visible;
}

div#main {
	width:800px;
	min-height:100%;
	position:absolute;
	top:0;
	right:-800px;
	/*right:-800px;*/
	color:#FFF;
	background:url("../img/side_triangle.png") 0 -100px no-repeat transparent;
	z-index:100;
}

img#mobile_title {
	display:none;
}

body#mr60x div#main {
	background:url("../img/side_triangle_mr60x.png") 0 -100px no-repeat transparent;
}

body#sr50x div#main {
	background:url("../img/side_triangle_sr50x.png") 0 -100px no-repeat transparent;
}

body#fx102 div#main {
	background:url("../img/side_triangle_fx102.png") 0 -100px no-repeat transparent;
}

div#text {
	width:290px;
	margin:130px 0 0 410px;
}

div#text p {
	margin:10px 0;
}

div#text p.intro {
	font-family: 'Josefin Slab', serif;
	font-weight:700;
	font-style:normal;
	font-size:16px;
	text-transform:uppercase;
}

div#text ul {
	padding:0;
	list-style-position: inside;
	list-style-type: square;
}

div#text ul li {
	margin-bottom:0.4em;
}

div#text a#more {
	display: block;
	height:20px;
	width:95px;
	text-indent:-99999px;
	background:url("../img/find_out_more.png") 0 0 no-repeat transparent;
	float:right;
	margin:0 6px 10px 0;
	outline: none;
}

div#text a#more:hover {
	background:url("../img/find_out_more.png") 0 -20px no-repeat transparent;
}

div#text a#back {
	display: block;
	height:20px;
	width:60px;
	text-indent:-99999px;
	background:url("../img/back_button.png") 0 0 no-repeat transparent;
	float:right;
	margin:0 6px 10px 0;
	outline: none;
}

div#text a#back:hover {
	background:url("../img/back_button.png") 0 -20px no-repeat transparent;
}

div#text a#spec_button {
	display: block;
	height:20px;
	width:120px;
	text-indent:-99999px;
	background:url("../img/spec_button.png") 0 0 no-repeat transparent;
	margin:0 6px 10px 0;
	float:left;
	outline: none;
	position:relative;
	z-index:2000;
}

div#text a#spec_button:hover {
	background:url("../img/spec_button.png") 0 -20px no-repeat transparent;
}


div#thumbs {
	position:relative;
	top:0;
	left:0;
	z-index:1000;
}

div#thumbs ul {
	list-style: none;
	margin:0;
	padding:0;
	width:136px;
	float:right;
}

div#thumbs ul li {
	float:left;
	margin-bottom:6px;
}

div#thumbs ul li.ma_ri {
	float:left;
	margin-right:6px;
}

div#thumbs ul li a {
	display:block;
	width:63px;
	height:63px;
	/*text-indent:-99999px;*/
	background:url("../img/thumb.png") 0 0 no-repeat transparent;
	outline: none;
}

div#info {
	display:none;
	margin-bottom:40px;
}

div#gallery {
	position:absolute;
	top:0;
	width:400px;
	height:100%;
	right:240px;
	overflow:hidden;
	z-index:500;
}

div#gallery .gall_img {
	padding-top:270px;
	width:100%;
	height:auto;
	position:absolute;
	top:3000px;
	left:0px;
	z-index: 1;	
	display:none;	
}

.gall_img ul {
	margin:0;
	padding:0;
	list-style: none;	
	position: relative;
}

.gall_img ul#fx102_color li img {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	display: none;
}

.gall_img ul#fx102_color li img.ac {
	display:inline-block;
}

.gall_img ul#colorsfx102 {
	top:200px;
	left:300px;
	z-index:9999;
}

div#gallery img {
	background: transparent;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */   
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
    zoom: 1;	
}

div#gallery .active {
	z-index: 3 !important;
	display: inline-block !important;
}

div#inner_img div#colorfr201, div#inner_img div#colorfx101, div#inner_img div#colorfr301 {
	float:none;
	width:100%;
}

div#colorfr201 img, div#colorfx101 img, div#colorfr301 img {
	display:none;
}

div#colorfr201 img.active, div#colorfx101 img.active, div#colorfr301 img.active {
	z-index: 3;
	display: inline-block;
}


body#inner_p div#main {
	width:90%;
	margin:0 auto;
	position:relative;
	top:0;
	left:0;
	padding-top:100px;
	min-height:auto;
}

div#inner_img {
	width:60%;
	margin:0 auto;
}

div#inner_img div {
	float:left;
	width:50%;
	position:relative;
}


div#inner_img img {
	position:absolute;
	top:0;
	left:0;
	width:100%;
}

div#inner_img h4 {
	padding-top:130%;
}

div#inner_img h4 img {
	padding-top:125%;
	width:140px;
}

div#inner_img ul {
	padding:0;
	margin:0;
	list-style-position: inside;
	list-style-type: square;	
	clear:both;
	position: relative;
	z-index:6000;
}

div#inner_img ul#colorsfr201, div#inner_img ul#colorsfx101, div#inner_img ul#colorsfr301 {
	list-style:none;
}

div#inner_img ul#colorsfr201 li, div#inner_img ul#colorsfx101 li, div#inner_img ul#colorsfr301 li {
	float:left;
	width:25px;
}

div#inner_img ul#colorsfr201 li img, div#inner_img ul#colorsfx101 li img, div#inner_img ul#colorsfr301 li img {
	position:static;
	width:100%;
}

div#footer {
	position:absolute;
	left:0;
	bottom:0px;
	z-index:300;
	width:100%;
	margin:0;
	padding:0;	
}

div#footer p {
	text-align:center;
	font-size:11px;
	margin:10px;
}


div#background {
	position:relative;
}

div#background img {
	position: absolute;
	top:0;
	left:0;
	z-index: 1;
}

div#background img.active {
	position: absolute;
	top:0;
	left:0;
	z-index: 3;
}

body#spec div#content {
	height:auto;
}

body#spec div#main {
	width:70%;
	margin:0 auto;
	position:relative;
	top:0;
	left:0;
	padding-top:180px;
}

body#spec div.legal {
	font-size:90%;
	margin-bottom:50px;
}

body#spec div.legal h4, body#spec div.legal p {
	margin:0;
}

body#spec div.legal p {
	margin-bottom:10px;
}

body#spec div#main table {
	border-collapse:collapse;
	margin-bottom:50px;
	width:100%;
}

body#spec div#main table ul {
	padding:5px;
	margin:0;
	text-align:left;
	list-style-position: inside;
}

body#spec div#main table td, body#spec div#main table th {
	padding:5px;
	text-align:center;
	border:1px solid #595959;
}

body#spec div#main table td.feat {
	vertical-align: top;
}

body#spec div#main table td.mr77 {
	/*background-color:#062c40;*/
}

body#spec div#main table th.mr77 {
	/*border-bottom:1px solid #00A8FF;*/
}

body#spec div#main table td.m55 {
	/*background-color:#312606;*/
}

body#spec div#main table th.m55 {
	/*border-bottom:1px solid #FFC000;*/
}

body#spec div#main table td.s44 {
	/*background-color:#340a06;*/
}

body#spec div#main table th.s44 {
	/*border-bottom:1px solid #FF3721;*/
}

body#spec div#main table th.fx3 {
	/*border-bottom:1px solid #05E4EC;*/
}

body#spec div#main table th.fx {
	/*border-bottom:1px solid #05CA4A;*/
}



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

	body#mr77x div#main {
		background:url("../img/side_triangle_mr77x.png") 0 -150px no-repeat transparent;
	}
	
	body#m55x div#main {
		background:url("../img/side_triangle_m55x.png") 0 -150px no-repeat transparent;
	}
	
	body#s44x div#main {
		background:url("../img/side_triangle_s44x.png") 0 -150px no-repeat transparent;
	}
	
	body#fx3x div#main {
		background:url("../img/side_triangle_fx3x.png") 0 -150px no-repeat transparent;
	}			
	
	div#main {
		width:700px;
	}
	
	div#text {
		margin-top:100px;
		margin-left:390px;		
	}
	
	div#gallery {
		right:160px;
	}	
	
	div#gallery .gall_img {
		padding:230px 0 0 0;
	}
	
	div#navi_cont {
		position:absolute;
		top:0;
		right:0;
		width:100%;
		height:40px;
		line-height:40px;
	}
	
	div#header ul#navi {
		width:180px;
		top:40px;
		/*right:100px;*/
		right:20px;
		height:auto;
		display:none;
	}

	div#header ul#navi li {
		width:180px;
		border-bottom:1px solid#595959;
	}

	div#header ul#navi li a {
		width:180px;
		border:none;
		background-color:#000;
	}
	
	div#header ul#navi li.last a {
		width:180px;
	}	
	
	a#pull {
		display:block;
		width:168px;
		position:absolute;
		top:0;
		right:20px;
		/*right:100px;*/
		height:38px;
		background-color:#000;
		border:1px solid#595959;
		color:#FFF;
		text-decoration:none;
		padding:0 0 0 10px;
		/*box-shadow:0 0 7px rgba(0, 0, 0, 0.75);*/
		outline: none;
		z-index:1000;
	}
	
	a#pull:after {
		content:"";  
        background: url("../img/nav-icon.png") no-repeat;  
        width: 30px;  
        height: 30px;  
        display: inline-block;  
        position: absolute;  
        right: 0px;  
        top: 10px;  		
	}
}

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

	div#header ul#navi {
		right:20px;
	}
	
	a#pull {
		right:20px;	
	}	
	
	body#mr77x div#main {
		background:url("../img/side_triangle_mr77x_alt.png") 100px -175px no-repeat transparent;
	}
	
	body#m55x div#main {
		background:url("../img/side_triangle_m55x_alt.png") 100px -175px no-repeat transparent;
	}
	
	body#s44x div#main {
		background:url("../img/side_triangle_s44x_alt.png") 100px -175px no-repeat transparent;
	}	
	
	body#fx3x div#main {
		background:url("../img/side_triangle_fx3x_alt.png") 100px -175px no-repeat transparent;
	}		
	
	div#main {
		width:700px;
	}
	
	div#text {
		margin-top:150px;
		margin-left:390px;
	}
	
	div#gallery {
		right:160px;
	}
	
	div#gallery .gall_img {
		padding:290px 0 0 0;
		width:100%;
	}
	
	body#spec div#main {
		margin:0 10px;
	}
	
	body#spec div#main table td, body#spec div#main table th {
		font-size:10px;
	}
}