/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 *
 * Detailed information about this CSS: h5bp.com/css
 *
 * ==|== normalize ==========================================================
 */

@import "stylev.css";
@import "shadowbox.css";
/* =============================================================================
   HTML5 display definitions
   ========================================================================== */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }


/* =============================================================================
   Base
   ========================================================================== */

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: sans-serif; color: #222;}

body { margin: 0; font-size: 1em; line-height: 1.4; background:url(../img/back.jpg) repeat; }

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate
 * Also: hot pink! (or customize the background color to match your design)
 */

::-moz-selection { background: #FFCC66; color: #000; text-shadow: none; }
::selection { background: #FFCC66; color: #000; text-shadow: none; }


/* =============================================================================
   Links
   ========================================================================== */

a { color: #8b0000; font-family:tahoma, arial, arial narrow; font-size:12px; text-decoration:none; }
a:visited { color: #8b0000; }
a:hover { color: #000000; }
a:focus { outline: thin dotted; }
a.deepblue
	{
	color:#4aa4ca;
	}
a.deepblue:hover
	{
	color:#ffffff;
	}
a.green
	{
	color:#58600a;
	}
/* Improve readability when focused and hovered in all browsers: h5bp.com/h */
a:hover, a:active { outline: 0; }


/* =============================================================================
   Typography
   ========================================================================== */

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

/* Redeclare monospace font family: h5bp.com/j */
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

/* Improve readability of pre-formatted text in all browsers */
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

/* Position subscript and superscript content without affecting line-height: h5bp.com/k */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }


/* =============================================================================
   Lists
   ========================================================================== */

ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }


/* =============================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Improve image quality when scaled in IE7: h5bp.com/d
 * 2. Remove the gap between images and borders on image containers: h5bp.com/i/440
 */

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/*
 * Correct overflow not hidden in IE9
 */

svg:not(:root) { overflow: hidden; }


/* =============================================================================
   Figures
   ========================================================================== */

figure { margin: 0; }


/* =============================================================================
   Forms
   ========================================================================== */

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

/*
 * 1. Correct color not inheriting in IE6/7/8/9
 * 2. Correct alignment displayed oddly in IE6/7
 */

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

/*
 * 1. Correct font-size not inheriting in all browsers
 * 2. Remove margins in FF3/4 S5 Chrome
 * 3. Define consistent vertical alignment display in all browsers
 */

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle;  padding:4px; font-weight:bold;  }

/*
 * 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet)
 */

button, input { line-height: normal; }

/*
 * 1. Display hand cursor for clickable form elements
 * 2. Allow styling of clickable form elements in iOS
 * 3. Correct inner spacing displayed oddly in IE7 (doesn't effect IE6)
 */

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

/*
 * Re-set default cursor for disabled elements
 */

button[disabled], input[disabled] { cursor: default; }

/*
 * Consistent box sizing and appearance
 */

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

/*
 * Remove inner padding and border in FF3/4: h5bp.com/l
 */

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

/*
 * 1. Remove default vertical scrollbar in IE6/7/8/9
 * 2. Allow only vertical resizing
 */

textarea { overflow: auto; vertical-align: top; resize: vertical; width:270px; }

/* Colors for form validity */
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }


/* =============================================================================
   Tables
   ========================================================================== */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* =============================================================================
   Chrome Frame Prompt
   ========================================================================== */

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }


/* ==|== primary styles =====================================================
   Author:
   ========================================================================== */



















/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
blockquote
	{
	font-family:Tahoma, arial narrow, arial, helvetica;
	font-size:12px;
	color:#000000;
	}
	blockquote.special
		{
		font-size:14px;
		margin:0px 50px;
		}
blockquote.special
	{
	float:right;
	display:block;
	margin:10px 10px 10px 10px;
	width:250px;
	padding:15px 25px 15px 35px;
	background:url(../img/grey-tex-back.jpg);
	font-style:italic;
	color:#000033;
	font-family:Arial, Helvetica, sans-serif;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	position:relative;
	}
	blockquote.special span.open
		{
		position:absolute;
		top:10px;
		left:10px;
		height:19px;
		overflow:hidden;
		width:23px;
		background:url(../img/quote-open-red.png);
		text-indent:90px;
		}
	blockquote.special span.close
		{
		position:absolute;
		bottom:10px;
		right:10px;
		overflow:hidden;
		height:19px;
		width:23px;
		background:url(../img/quote-stop-red.png);
		text-indent:90px;
		}
h1
	{
	font-family:tahoma, arial narrow, arial, helvetica;
	font-size:16px;
	font-weight:normal;
	margin:0px 0px 0px 0px;
	padding:0px 0px 4px 4px;
	border-bottom:#df8d8d thin solid;
	}
	h1 span
		{
		font-weight:bold;
		}
	h1.copper
		{
		font-family:"Copperplate", Tahoma, "Arial Black";
		font-size:16px;
		line-height:18px;
		}
	h1.noborder
		{
		border:none;
		}
	h1.topmargin
		{
		padding-top:8px;
		padding-bottom:2px;
		}
h2
	{
	font-family:tahoma, arial narrow, arial, helvetica;
	font-size:14px;
	font-weight:bold;
	margin:8px 0px 0px 0px;
	padding:0px 0px 4px 4px;
	border-bottom:#4aa4ca thin solid;
	}
h3
	{
	font-family:tahoma, arial narrow, arial, helvetica;
	font-size:12px;
	font-weight:bold;
	margin:8px 0px 0px 0px;
	padding-top:0px;
	}
p
	{
	font-family:"Tahoma", Arial narrow, Arial, Helvetica;
	font-size:13px;
	
	padding:8px 15px 0px 15px;
	}
.deepred
	{
	color:#690102;
	}
.deepblue
	{
	color:#4aa4ca;
	}
.green
	{
	color:#6ca613;
	}
.white
	{
	color:#ffffff;
	}
.nomargin
	{
	margin:0px;
	}
	
a.buttonright
	{
	display:block;
	padding:4px 0px 4px 12px;
	margin:5px 0px;
	width:78px;
	height:16px;
	overflow:hidden;
	background:url(../img/button-small.png) top left;
	font-family:tahoma, arial narrow, arial;
	font-size:12px;
	text-decoration:none;
	color:#555555;
	
	}
	a.buttonright:hover
		{
		background-position:0px -24px;
		color:#000000;
		}
	a.buttonright:active
		{
		background-position:0px -24px;
		margin-top:6px;
		margin-left:2px;
		}
	
#container
	{
	width:904px;
	margin:0 auto;
	}
	#logo
		{
		width:900px;
		height:124px;
		margin:0 auto;	
		}
#sub-container
	{
	width:900px;
	border:3px #000000 solid;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}
	#navigation
		{
		width:900px;
		height:45px;
		background:url(../img/nav-back.png);
		}
		#navigation ul
			{
			list-style-type:none;
			margin:0px;
			padding:0px;
			}
			#navigation ul li
				{
				list-style-type:none;
				float:left;
				background:url(../img/nav-sep.png) top right no-repeat;
				padding-right:1px;
				}
				#navigation ul li.home
					{
					width:85px;
					}
					#navigation ul li.home a
						{
						padding-left:26px;
						}
				#navigation ul li.profile
					{
					width:177px;
					}
					#navigation ul li.profile a
						{
						padding-left:22px;
						}
				#navigation ul li.legacy
					{
					width:125px;
					}
					#navigation ul li.legacy a
						{
						padding-left:22px;
						}
				#navigation ul li.brands
					{
					width:113px;
					}
					#navigation ul li.brands a
						{
						padding-left:29px;
						}
				#navigation ul li.ini
					{
					width:177px;
					}
					#navigation ul li.ini a
						{
						padding-left:22px;
						}
				#navigation ul li.exports
					{
					width:105px;
					}
					#navigation ul li.exports a
						{
						padding-left:22px;
						}
				#navigation ul li.contacts
					{
					width:111px;
					}
					#navigation ul li.contacts a
						{
						padding-left:20px;
						}
				#navigation ul li a
					{
					display:block;
					margin:0px auto;
					margin-top:1px;
					padding-top:12px;
					
					height:29px;
					font-family: Tahoma, Arial Narrow, Arial;
					font-size:14px;
					
					text-decoration:none;
					text-transform:uppercase;
					color:#595959;
					
					background:url(../img/nav-hover-back.png) repeat-x;
					background-position:0px 0px;
					}
				#navigation ul li a.active
					{
					background-position:0px -180px !important;
					color:#000000;
					}
				
				#navigation ul li a:hover
					{
					background-position:0px -180px;
					color:#000000;
					}
					
				.brandnavi
					{
					width:900px;
					
					height:150px;
					opacity:.1;
					display:none;
					position:relative;
					}
						.brandnavi #brandleft
							{
							width:20px;
							height:40px;
							position:absolute;
							left:-20px;
							top:55px;
							
							}
						.brandnavi #brandright
							{
							width:20px;
							height:40px;
							position:absolute;
							right:-20px;
							top:55px;
							
							}
							#gallery-container
							{
							float:left;
							position:relative;
							overflow:hidden;
							width:100%;
							margin:30px 10px;
							}
							
							#gallery
								{
								
								height:170px;
								
								}
								#carousel-demo1
									{
									width:100%;
									height:130px !important;
									}
								#carousel-demo1 ul
									{
									
									padding:0px;
									margin:0px;
									height:130px !important;
									}
									
								#carousel-demo1 li {
									height:130px;
									
									color:#666; 
									float:left;
									overflow:hidden;
									width:130px;
									
									list-style:none;
									margin-right:10px;	
								}
								#carousel-demo1 li.last
									{
									margin-right:0px;
									}
								#carousel-demo1 ul li a
									{
									display:block;
									width:130px;
									height:130px;
									}
								#gallery a>img
									{
									padding:2px;
									border:1px #aaaaaa solid;
									max-height:130px;
									-webkit-transition:all .5s ease;
									-moz-transition:all 0.5s ease;
									-o-transition:all 0.5s ease;
									-ms-transition:all 0.5s ease;	
									transition:all 0.5s ease;
									}
									#gallery a:hover img
										{
										border:1px #990000 solid;
										
										}
							.brands1
								{
								margin:5px 5px 0px 5px;
								}
								.brands1 .set
									{
									margin-top:5px;
									}
							.brands1 a
									{
									
									margin-right:0px;
									
									}
								.brands1 a img
									{
									padding:2px;
									border:1px #f0f0f0 solid;
									
									-webkit-transition:all .5s ease;
								-moz-transition:all 0.5s ease;
								-o-transition:all 0.5s ease;
								-ms-transition:all 0.5s ease;	
								transition:all 0.5s ease;
									}
									.brands1 a:hover img
										{
										border:1px #990000 solid;
										background:#990000;
										}
	#content
		{
		width:900px;
		min-height:300px;
		background:#f0f0f0;
		}
			#content #slideshow
				{
				height:398px;
				width:600px;
				margin:10px 10px 0px;
				float:left;
				position:relative;
				}
				#slideshow IMG {
					position:absolute;
					top:0;
					left:0;
					z-index:8;
					opacity:0.0;
				}
				
				#slideshow IMG.active {
					z-index:10;
					opacity:1.0;
				}
				
				#slideshow IMG.last-active {
					z-index:9;
				}
				
			#content .leftnavi
				{
				
				float:left; 
				width:209px; 
				margin-top:10px;
				padding:10px 10px;
				margin-left:10px;
				margin-right:10px; 
				min-height:261px;
				background:url(../img/leftnavi.png) no-repeat right top;
				}
				#content .leftnavi h3 a
					{
					display:block;
					margin:0px;
					margin-top:5px;
					padding:0px;
					font-size:12px;
					font-weight:bold;
					-webkit-transition:all .1s ease;
								-moz-transition:all 0.1s ease;
								-o-transition:all 0.1s ease;
								-ms-transition:all 0.1s ease;	
								transition:all 0.1s ease;
					}
					
			
				#content .leftnavi ul
					{
					margin:0px;
					padding:0px 10px 0px 0px;
					width:100%;
					list-style-type:none;
					}
					#content .leftnavi ul li
						{
						margin:0px;
						list-style-type:none;
						
						}
						#content .leftnavi ul li a
							{
							display:block;
							margin:4px 4px;
							padding:4px 12px;
							font-size:11px;
							color:#252525;
							-webkit-transition:all .1s ease;
								-moz-transition:all 0.1s ease;
								-o-transition:all 0.1s ease;
								-ms-transition:all 0.1s ease;	
								transition:all 0.1s ease;
							border-bottom:#eaeaea thin solid;
							background:url(../img/small_arrow.png) left center no-repeat;
							}
							#content .leftnavi ul li a.selected
								{
								color:#ffffff;
								background:#8b0000;
								font-weight:bold;
								padding:4px 16px;
								}
							
							#content .leftnavi li a:hover
								{
								color:#8b0000;
								padding:4px 16px;
								background:url(../img/small_arrow_red.png) left center no-repeat;
								-webkit-transition:all .1s ease;
								-moz-transition:all 0.1s ease;
								-o-transition:all 0.1s ease;
								-ms-transition:all 0.1s ease;	
								transition:all 0.1s ease;
								}
						.form
							{
							width:90%;
							margin:15px;
							}
						.form td
							{
							padding:10px;
							vertical-align:middle;
							border-bottom:#eaeaea thin solid;
							color:#444444;
							line-height:16px;
							font-size:12px;
							}
					#content .sidecontent
						{
						width:880px;
						clear:both;
						margin:25px 10px 0px 10px;
						padding-top:20px;
						}
						#content .sidecontent a.nodisplay
							{
							display:none;
							}
						#content .sidecontent a.novdisplay
							{
							display:inline;
							}
						#content .sidecontent a img
							{
							margin:0 auto 10px 5px;
							
							padding:4px;
							border:#dedede thin solid;
							}
							#content .sidecontent a:hover img
								{
								border:#999999 thin solid;
								
								}
							#content .sideinfo
								{
								width:860px;
								margin:10px auto;
								
								}
								
					
							#content img.brand
								{
								width:860px;
								}
							#content .sideinfo .info p
								{
								margin:0px;
								padding:0px 8px 8px 0px;
								font-style:italic;
								}
								#s1 .viewport { width: 860px; height: 440px; overflow: hidden; position: relative; }
								#s2 .viewport { width: 860px; height: 578px; overflow: hidden; position: relative; }
								.sideinfo .overview { list-style: none; position: absolute; left: 0; top: 0; }
								.sideinfo .thumb .end,
								.sideinfo .thumb { background:url(../img/grey-tex-back-hover.png); }
								.sideinfo .scrollbar { position: relative; float: right; width: 5px; }
								.sideinfo .track { background:url(../img/grey-tex-back.jpg); height: 100%; width:13px; position: relative; padding: 0 1px; }
								.sideinfo .thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
								.sideinfo .thumb .end { overflow: hidden; height: 5px; width: 13px; }
								.sideinfo .disable{ display: none; }
							#content .navright
								{
								float:right;
								margin:10px;
								padding:10px;
								background:url(../img/grey-tex-back.jpg);
								width:200px;
								height:100px;
								position:relative;
								overflow:hidden;
								}
								
						
							
					
			#content #left
				{
				width:630px;
				margin:25px 10px 10px 10px;
				float:left;
				position:relative;
				}
				#left h1
					{
					font-weight:bold;
					margin-bottom:10px;
					}
			#content #right
				{
				width:272px;
				margin:10px 0px 10px 8px;
				float:right;
				overflow:hidden;
				}
			#content .infra
				{
				padding:10px;
				margin:10px;
				width:860px;
				overflow:hidden;
				float:left;
				}
				#content .infra h1
					{
					margin-bottom:5px;
					}
				#content  .unit
					{
					width:299px;
					margin:20px 5px;
					padding:4px;
					float:left;
					}
					#content  .unit:nth-child(even) {
						margin-right:0px;
					}
					#content  .unit img {
						max-width: 100%;
					}
					#content h2
						{
						margin-bottom:4px;
						}
					#content  .unit p
						{
						padding:5px 15px 0px 15px;
						}
			#content #infocus
				{
				width:272px;
				margin:10px 0px 10px 8px;
				float:right;
				height:398px;
				overflow:hidden;
				}
				#infocus .item
					{
					width:262px;
					height:112px;
					overflow:hidden;
					margin-top:7px;
					padding:1px;
					background:url(../img/grey-tex-back.jpg) repeat;
					position:relative;
					}
					
					
					#infocus .item .cocostory
						{
						width:100%;
						height:100%;
						background:#ffffff;
						}
					#infocus .item .vodkastory
						{
						width:100%;
						height:100%;
						min-height:120px;
						background:#000000;
						}
					#infocus .item .cocktailstory
						{
						width:100%;
						height:100%;
						background:#acbdb0;
						}
			#content .midcontent
				{
				width:880px;
				padding:10px;
				}		
				.midcontent .item .nimg
					{
					float:left;
					margin:0px 10px 10px 0px;
					}
				#content .midcontent .item
					{
					float:left;
					
					margin:0px 10px 10px 10px;
				
					}
				
			#content #years
				{
				width:66%;
				float:left;
				height:202px;
				background:url(../img/bottom-banner-back-1.jpg) repeat-x;
				}
					#content #years .celeinfo
						{
						display:block;
						}
			#content #experience
				{
				width:34%;
				float:left;
				height:202px;
				background:url(../img/bottom-banner-back-2.jpg) repeat-x;
				}
			#content #cocktail
				{
				display:none;
				width:32%;
				height:202px;
				float:left;
				background:url(../img/bottom-banner-back-3.jpg) repeat-x;
				}
#footer
	{
	background:url(../img/80-black.png);
	width:886px;
	padding:10px;
	margin:10px auto;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	}
	#footer ul
		{
		margin:0px;
		padding:0px;
		float:right;
		}
	
	#footer ul li
		{
		float:left;
		
		list-style-type:none;
		}
		#footer ul li a
			{
			color:#999999;
			font-size:11px;
			}
			#footer ul li a:hover
				{
				color:#ffffff;
				}
				
				
				
		ul.countdown {
list-style: none;
margin: 8px 0;
padding: 0;
display: block;
text-align: left;
}
ul.countdown li {
display: inline-block;
text-align: left;
}
ul.countdown li span {
font-size: 20px;
font-weight: 300;
line-height: 20px;
}
ul.countdown li.seperator {
font-size: 20px;
line-height: 28px;
vertical-align: top;
}
ul.countdown li p {
color: #a7abb1;
font-size: 14px;
text-align: center;
padding:0px 10px 0px 0px;
}		

.page-bg {
	
	padding:4px;
	width:200px;
	font-size:11px; color:#fff;
	margin:8px 0px;
	border:#dedede thin solid;
}	
.page-bg div {
	background:#000;
	padding:12px;
}	
.page-bg ul.countdown li span {
	font-size:11px;
}	
.page-bg ul.countdown li p { 
font-size:9px;}

.export-nav {
	padding:0px 0px;
	text-align:center;
}
.export-nav a {
	display:inline-block;
	font-size:16px;
	box-sizing: border-box;
	color:#333;
	width:50%;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,cccccc+100;Gren+3D */
background: rgb(238,238,238); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(238,238,238,1) 0%, rgba(204,204,204,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */

	border:#ccc  solid;
	border-width:1px 0px;
	padding:8px 24px;
}
.export-nav a.selected {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fefcea+0,f1da36+100;Gold+3D */
background: rgb(254,252,234); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(254,252,234,1) 0%, rgba(241,218,54,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(254,252,234,1) 0%,rgba(241,218,54,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefcea', endColorstr='#f1da36',GradientType=0 ); /* IE6-9 */

}	
.export-nav a:hover {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#eeeeee+0,eeeeee+100;Grey+Flat */
background: rgb(238,238,238); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(238,238,238,1) 0%, rgba(238,238,238,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(238,238,238,1) 0%,rgba(238,238,238,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(238,238,238,1) 0%,rgba(238,238,238,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */

}	
.export-nav a:focus {
	outline:none;
}	
/* ==|== media queries ======================================================
   EXAMPLE Media Query for Responsive Design.
   This example overrides the primary ('mobile first') styles
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 1200px) {

#container, #navigation, #sub-container, #content, .brandnavi
	{
	width:1150px;
	}
	#footer
		{
		width:1136px;
		}

		
#content #infocus
				{
				width:272px;
				margin:10px 0px 0px 8px;
				float:left;
				height:398px;
				overflow:hidden;
				}
.brandnavi
					{
					width:1150px;
					
					}
							
				#content .midcontent
				{
				width:230px;
				float:left;
				margin:5px 8px 0px 8px;
				padding:0px;
				
				overflow:hidden;
				}		
				#content .midcontent .item
					{
					float:left; width:210px;
					margin:0px 10px 0px 10px;
					
					padding-bottom:0px;
					border-bottom:#dedede thin solid;
					overflow:hidden;
					}	
						#content .midcontent .item:last-child {
							border-bottom:none;
						}
					.midcontent .item .nimg
						{
						margin: 8px 5px;
						float:none;
						}
					.midcontent .item h3
						{
						margin:5px;
						}
					.midcontent .item p				
						{
						margin:2px;
						padding:2px;
						}
			#content #left
				{
				width:630px;
				margin:25px 10px 10px 10px;
				float:left;
				position:relative;
				}
			#content #right
				{
				width:272px;
				margin:10px 0px 10px 8px;
				float:left;
				overflow:hidden;
				}
			
				#content #years
				{
				width:50%;
				float:left;
				height:202px;
				background:url(../img/bottom-banner-back-1.jpg) repeat-x;
				}
					#content #years .celeinfo
						{
						display:none;
						}
			#content #experience
				{
				width:50%;
				float:left;
				height:202px;
				background:url(../img/bottom-banner-back-2.jpg) repeat-x;
				}
			#content #cocktail
				{
				display:block;
				width:32%;
				height:202px;
				float:left;
				background:url(../img/bottom-banner-back-3.jpg) repeat-x;
				}		
			#navigation ul li.home
					{
					width:90px;
					}
					#navigation ul li.home a
						{
						padding-left:26px;
						}
				#navigation ul li.profile
					{
					width:189px;
					}
					#navigation ul li.profile a
						{
						padding-left:30px;
						}
				#navigation ul li.legacy
					{
					width:144px;
					}
					#navigation ul li.legacy a
						{
						padding-left:33px;
						}
				#navigation ul li.brands
					{
					width:108px;
					}
					#navigation ul li.brands a
						{
						padding-left:27px;
						}
				#navigation ul li.ini
					{
					width:182px;
					}
					#navigation ul li.ini a
						{
						padding-left:14px;
						}
				#navigation ul li.exports
					{
					width:142px;
					}
					#navigation ul li.exports a
						{
						padding-left:24px;
						}
				#navigation ul li.contacts
					{
					width:127px;
					}
					#navigation ul li.contacts a
						{
						padding-left:16px;
						}			
				#navigation ul li.infra {
					width:160px;
				}	
					#navigation ul li.contacts a
						{
						padding-left:22px;
						}
		#content .sidecontent
						{
						width:220px;
						margin-left:10px;
						margin-right:0px;
						padding-left:16px;
						padding-top:10px;
						margin-top:10px;
						clear:none;
						min-height:261px;
						background:url(../img/rightnavi.png) no-repeat left top;
						float:left;
						}
						#content .sidecontent a.nodisplay
							{
							display:inline;
							}
						#content .sidecontent a.novdisplay
							{
							display:none;
							}
						#content .sidecontent a img
							{
							margin:0 auto 10px auto;
							
							padding:4px;
							border:#dedede thin solid;
							}
							#content .sidecontent a:hover img
								{
								border:#999999 thin solid;
								
								}	
				#content .sideinfo
						{
						width:212px;
						height:640px;
						overflow:hidden;
						margin-left:10px;
						margin-right:0px;
						padding-left:16px;
						padding-right:8px;
						padding-top:10px;
						margin-top:10px;
						clear:none;
						min-height:261px;
						background:url(../img/rightnavi.png) no-repeat left top;
						float:left;
						}
						#content #s2
							{
							height:578px;
							}
						#content img.brand
							{
							width:860px;
							}
							
						
								#s1 .viewport { width: 200px; height: 640px; overflow: hidden; position: relative; }
								#s2 .viewport { width: 200px; height: 578px; overflow: hidden; position: relative; }
								.sideinfo .overview { list-style: none; position: absolute; left: 0; top: 0; }
								.sideinfo .thumb .end,
								.sideinfo .thumb { background:url(../img/grey-tex-back-hover.png); }
								.sideinfo .scrollbar { position: relative; float: right; width: 5px; }
								.sideinfo .track { background:url(../img/grey-tex-back.jpg); height: 100%; width:13px; position: relative; padding: 0 1px; }
								.sideinfo .thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
								.sideinfo .thumb .end { overflow: hidden; height: 5px; width: 13px; }
								.sideinfo .disable{ display: none; }
			
  /* Style adjustments for viewports that meet the condition */
}