@import url(reset.css);
@import url(debug.css);
@import url(form.css);
@import url(pages.css);

* {margin: 0;padding: 0;}

html 
{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-size: 100.01%;
}

body 
{
	font-family: Arial, Tahoma, sans-serif;
	font-size: 62.5%;
	height: 100%;
	position: relative;
	background: #d5d5d5 url("../img/bg_body.jpg") center top repeat-y;
}

html>body {height: auto;min-height: 100%;}

/*Global*/

a {color: #3561b0;}
a:hover {color: #902455;}
p{line-height: 1.2em;}

strong {font-weight: bolder;}

/********/
#flow 
{
	min-width: 1000px;
	max-width: 1100px;
	margin: 0 auto;
	height: 100%;
}

#page 
{
	padding: 0 0 190px 2%;
	background: #fff url("../img/bg_buttom-visual-main.jpg") no-repeat bottom right;
	position: relative;
}

	/* backs */
	#page.bg-main 
	{
		background: #fff url("../img/bg_buttom-visual-main.jpg") no-repeat bottom right;
	}
	
	#page.bg-inner 
	{
		background: #fff url("../img/bg_buttom-visual-inner.jpg") no-repeat bottom right;
	}
	
	#page.bg-candy 
	{
		background: #fff url("../img/bg_buttom-visual-candy.jpg") no-repeat bottom right;
	}
	/* backs */

/*Header*/
#header 
{
	font-size: 1.2em;
	padding: 35px 0 23px 0;
	height: 65px;
}

	#header dl {float: left;margin: 0 20px 0 0;}
	#header dt {font-size: 2em;padding: 0 0 4px 0;}
	#header dd {}
	#header dd a {font-size: .9em;margin: 18px 0 0 0;float: left;}

ul#home {display: block;margin:  0 100px 0 22px;float: left;}

	#home li {display: inline;float: left;margin: 30px 39px 0 0;}
	#home li:before {content: "";}
	#home li.active {}
	
		#home li a, #home li span
		{background: url("../img/icon_sprite.png") no-repeat;display: block;}
		
		#home li a.home, #home li span.home {width: 11px;height: 11px;background-position: 0 -26px;}
			#home li.active a.home, #home li.active span.home{background-position: 0 0px;}
			
		#home li a.search, #home li span.search {width: 11px;height: 12px;background-position: 0 -78px;}
			#home li.active a.search, #home li.active span.search {background-position: 0 -52px;}
		
		#home li a.mail, #home li span.mail {width: 15px;height: 11px;background-position: 0 -133px;}
			#home li.active a.mail, #home li.active span.mail {background-position: 0 -106px;}
	
	
	#home li a {display: block;}
	#home li a em, #home li span em {display: none;}
	
#language {margin: 0 0 0 18px;float: right;display: block;}

	#language li {display: inline;float: left;}
	#language li:before {content: "";}
	#language li.active {background: url("../img/icon_sprite.png") no-repeat left -475px;}
	#language li.active a {text-decoration: none;color: #fff;}
	#language li a {display: block;padding: 3px 15px 3px 5px;margin: 0 5px 0 0;}

/*--------------------------------------------*/
/*Body*/
#body 
{
	font-size: 1.2em;
	line-height: 1.2em;
	display: block;
	position: relative;
}

/*Sidebar*/
.sidebar {width: 212px;display: block;float: left;position: relative;}
	
	.sidebar h2 {font-size: 1.5em;padding: 9px 0 14px 0;}
		.sidebar h2 a {color: #606a74;background: #f2f2f2;padding: 9px 19px 8px 13px;}
			.sidebar h2 a:hover {}
			
	.sidebar div, .sidebar em a {color: #606a74; line-height: 1.6em;}
	.sidebar em a:hover { color: #3561b0; }
	
	.sidebar ul {}
	.sidebar li {display: inline;float: left; margin-left: 20px;}
		.sidebar li:before {content: "";}
		
	.sidebar dl {font-size: 1.1em;padding: 110px 0 105px 0;}
	.sidebar dt {text-align: center;padding: 0 0 16px 0;}
	.sidebar dd {text-align: center;}
	
#logo 
{
	width: 216px;
	height: 95px;
	margin: 0 0 10px -10px;
	display: block;
	position: relative;
}

	#logo a, #logo span 
	{
		display: block;
		width: 216px;
		height: 95px;
		background: url("../img/logo.png") no-repeat;
                margin-left: 10px;
	}
	
	#logo em {display: none;}

#menu {font-size: 1.1em;padding: 30px 0; font-weight: 500; width: 220px;}

	#menu li {display: block;float: none;padding: 6px 0;}

		#menu li:before {content: "";}
		#menu li.active, #menu li.opened { background: #f2f2f2 url("../img/bg_active.gif") no-repeat top right;margin-right: 45px; margin-left: 10px;}
	
		#menu li a {display: block;}
			#menu li.active a, #menu li.opened  a{padding: 0 0 4px 12px;color: #606a74;}
		
.list {padding: 15px 0 0 0;}
	
	.list  li {padding: 0 5px 5px 0;}
	.list  li:before {content: "";}
	
/*Visual*/
#visual 
{
	width: 75.5%;
	position: relative;
	display: block;
	float: left;
	padding: 0 0 0 24px;
}

#visual .glamur
{
	display: block;
	width: 35px;
	position: absolute;
	right: 0;
	top: 0;
	height: 450px;
	background: url("../img/bg_glamur_img.png") no-repeat -165px 0; 
}	

	#visual em 
	{
		font-size: 2.5em;
		line-height: 1em;
		font-weight: bold;
		font-style: normal;
		position: absolute;
		top: 27px;
		right: 205px;
	}
	
		#visual em a
		{
			color: #000;
			text-decoration: none;
			border-bottom: 1px solid #333;
		}
			#visual em a:hover
			{
				color: #fff;
				border-bottom: none;
				background: #333;
			}
	
	#visual p
	{
		font-size: 1.4em;
		line-height: normal;
	}
	
.shadow 
{
	background: url("../img/bg_shadow.jpg") no-repeat left bottom;
	margin: 0 0 25px -24px;
	padding-left: 24px;
	position: relative;
}

		.shadow a.more 
		{
			font-size: 1.35em;
			font-weight: bold;
			text-decoration: underline;
			line-height: 1em;
			color: #fff;
			position: absolute;
			left: 48px;
			bottom: 25px;
		}
			
			.shadow a.more:hover {text-decoration: none;}
	
#img {}
.glamur_img {position: absolute;right: 0;top: 0;}
/*
#visual  .shadow {padding-right: 40px;}
*/
#list-catalog 
{
	font-size: 1.15em;
	display: block;
	width: 160px;
	height: 374px;
	padding: 27px 0 0 0;
	position: absolute;
	top: 0;
	right: 30px;
	background: url("../img/bg_visual.jpg") repeat-x;
}
	
	#list-catalog ul {padding: 0 0 0 13px;}
	#list-catalog li {}

		#list-catalog li li {display: inline;float: left;margin: 9px 2px;}
		#list-catalog li li a {color: #000;text-decoration: none;border-bottom: 1px dotted;}
		#list-catalog li li a:hover { color: #ff681f;text-decoration: none;border-bottom-color: #ff681f; }
		
			#list-catalog li li.active {}
			#list-catalog li li.active a {background: #000;color: #fff;margin: 0 1px 0 1px;border: none;padding: 4px 2px;}
	
/*--------------------------------------------*/

#top
{
	width: 100%;
	position: relative;
	display: block;
}

#info 
{
	width: 100%;
	display: block;
	position: relative;
	height: 225px;
	overflow: hidden;
	padding: 47px 0 53px 0;
	clear: both;
}

#question 
{
	display: block;
	padding-left: 24px;
	float: left;
	background: url("../img/bg_shadow.jpg") no-repeat left bottom;
}

	#question div
	{
		display: block;
		width: 450px;
		height: 225px;
		background: url("../img/bg_question.png") no-repeat left top;
	}
	
	#question .update
	{
		width: 15px;
		height: 12px;
		display: block;
		background: url("../img/icon_sprite.png") no-repeat 0 -161px;
		margin: 0 0 0 20px;
	}
	
		#question .update em {display: none;}

	#question h2 {font-size: 2em;font-weight: bold;padding: 32px 0 25px 24px;}
		#question h2 a {color: #fff;text-decoration: none;}
		
	#question dl {font-size: 1.1em;padding: 0 50px 0 24px;}
	#question dt {padding: 0 0 22px 0;}
		#question dt a {color: #000;}
		#question dt a { color: #06294b; }
	#question dd {color: #fff;margin: 0 0 14px 0;line-height: 1.2em;display: block;height: 50px;}
	
#media 
{
	height: 225px;
	display: block;
	overflow: hidden;
	padding: 0 0 0 24px;
	position: relative;
	background: url("../img/bg_shadow.jpg") no-repeat bottom left;
}

#video {display: block;width: 400px;height: 225px;float: left;}

#more 
{
	height: 205px;
	width: 106px;
	float: left;
	padding: 20px 0 0 13px;
	background: url(../img/bg_more.png) no-repeat;
}
	
	#more  a 
	{
		font-size: 1.15em;
		font-weight: bold;
		line-height: 1.2em;
		text-decoration: none;
		color: #000;
		border-bottom: 1px dotted;
	}
	
		#more  a:hover { color: #3561B0;border-color: #3561B0; }
		
#new 
{
	display: block;
	float: left;
	padding: 0 0 0 24px;
	position: relative;
}
	
	#new h2 {font-size: 2.5em;font-weight: normal;padding: 5px 0 11px 0;}
		#new h2 a {color: #606a74;}
		#new h2 a:hover {text-decoration: none;}
	#new ul {padding: 20px 0 0 0;float: left;clear: both;position: relative;width: 500px;}
	#new li {display: inline;float: left;margin: 0 23px 0 0;}
		
		#new li:before {content: "";}
		#new li.active {}
		
		#new li a 
		{
			display: block;
			width: 7px;
			height: 7px;
			text-decoration: none;
			background: url("../img/icon_sprite.png") no-repeat 0 -190px;
		}
		
		#new li.active a {background-position: 0 -213px}

.products 
{
	width: 270px;
	display: block;
	float: left;
	position: relative;
	margin: 45px 60px 0 0;
        height: 160px;
}
	
	.products dt, .products dd.photo  
	{	
		margin: 0 0 14px -24px;
		padding: 0 0 0 24px;
		background: url("../img/bg_shadow.jpg") no-repeat left bottom;
		position: relative;
	}
	
		.products dt a {width: 200px;height: 150px;display: block;text-decoration: none;}
		
			.products dt a span 
			{
				width: 200px;
				height: 150px;
				position: absolute;
				display: block;
				top: 0;
				left: 24px;
				background: url("../img/bg_glamur_img.png") no-repeat 0 -250px;
				cursor: hand;			
			} 
	
	.products dd {}
		
		.products dd a {text-decoration: none;}
		.products dd.glamur {display: block;position: absolute;right: 0;top: 0;}
			
			.products dd.glamur span 
			{
				width: 55px;
				height: 55px;
				position: absolute;
				display: block;
				top: 0;
				left: 0;
				background: url("../img/bg_glamur.png") no-repeat;
				cursor: hand;
			}

/*Footer*/
#footer 
{
	width: 100%;
	font-size: 1.2em;
	display: block;
	padding: 20px 0 0 0;
	position: relative;	
}

	#footer ul {
		position: absolute;
		top: 40px;
		left: 320px;
		width: 35%;padding: 25px 0 0 0;float: left;display: block;
	}
	
	#footer li 
	{
		display: inline;
		float: left;
		margin: 0 20px 6px 0;
		padding: 0 0 0 0;
	}
	
		#footer li:before {content: "";}
		#footer li.active {}
			#footer li.active a {color: #606a74;}
		
#copy 
{
	float: left;
	display: block;
	width: 250px;
	margin: 0 50px 50px 0;
	position: absolute;
	top: 40px;
	left: 20px;
}
	
	#copy div 
	{
		background: url("../img/bg_copy.png") no-repeat;
		width: 224px;
		height: 78px;
		padding: 25px 0 0 49px;
	}

/*--------------------------------------------*/

.clear{clear: both;font-size: 0;overflow: hidden;}
.seachform {z-index: 20;position: relative;}

.media
{
	font-size: 1.2em;
	line-height: 1.5em;
	margin-left: 20px;
}

.media dt
{
	font-size: 1.2em;
	font-weight: bolder;
	margin-top: 10px;
}

.media dt span
{
	text-decoration: none;
	border-bottom: 1px dashed;
}

#search_result
{
	
}

	#search_result dt
	{
		font-weight: bolder;
		font-size: 1.5em;
		line-height: normal;
	}

	#search_result dd
	{
		font-style: italic;
		color: #777;
		line-height: normal;
		margin: 0 0 2em 2em;		
	}
	
	#search_result .time_post
	{
		margin-top: -1.5em;
		font-style: normal;
		color: #333;
	}
	
	#search_result .time_post a
	{
		
	}
	
	#search_result p
	{
		padding-bottom: 1em;
	}

#search_form
{
	width: 250px;	
	margin-bottom: 2em;
	font-size: .75em;
	float: right;
	padding: 10px;
}

#search_form .sf
{
	background: #fff;
	width: 150px;
	border: 1px solid #777;
}

#search
{
	font-size: 28px;
	font-family: Arial, Helvetica, sans-serif;
	color: #606a74;
	border: 1px solid #cccccc;
	border-top: 1px solid #666666;
	padding: 4px; 
	width: 400px;
	margin-right: 20px;
}
#search-form .fb
{
	font-size: 28px;	
}

#search.search-faq
{
	font-size: 12px;
}
#visual .play-pause {
	position: absolute;
	top: 33px;
	left: 8.1%;
	cursor: pointer;
}


#art
{
	background: #fff;
	height: 35px;
	float: left;
	font-size: 1em;
	padding: 0;	
	position: absolute;
	bottom: -178px;
	left: 40px;
	padding: 5px;
	display: block;
        border-radius: 5px 5px 5px 5px;
}

#art em
{
	text-decoration: underline;
	font-style: normal;
	color: #3561B0;	
}

#art em:hover 
{
	
}

#art strong
{
	font-size: 1.1em;
}

#art strong a
{
	text-decoration: none !important;
	color: #606A74 !important;	
	font-style: normal;	
	font-weight: normal;		
}

#art a
{
	line-height: 1.25em;
}

#art strong a:hover em
{
	color: #FF681F;
}

#flow .bg-candy #art
{
	bottom: -160px;
}

#flow .bg-inner #art
{
	bottom: -186px;
}