/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Left & Right alignment */

.left { float:left;}
.right { float:right;}
.wrapper {width:100%; overflow:hidden;}

/* Global properties ======================================================== */

body{ background:#666; border:0; font:13px Arial, Helvetica, sans-serif; color:#9e9e9e; line-height:20px; min-width:520px; overflow:hidden}

/* Global Structure ============================================================= */

.main {	margin: 0 auto; width:520px; height:800px; background:url(../images/bg.jpg) 0 0 no-repeat;}


/* ============================= main layout ====================== */

a{ color:#fff; text-decoration: none; outline:none}
a:hover{ text-decoration: underline}
h1{ padding: 45px 0 0 0}
h2{
	font-size:24px;
	color:#fff;
	line-height:1.2em;
	padding:19px 0 19px 0;
	letter-spacing:-1px;
} 
p{ padding-bottom:20px;}

/* ============================= header ====================== */
header{ padding:0 29px; height:224px; position:relative; z-index:2}
#page1 header{ height:490px;}

#logo{
	display:block;
	background:url(../images/logo.png) 0 0 no-repeat;
	width:301px;
	height:51px;
	text-indent:-9999px;
}

#menu { padding-top:51px;  height:48px; position:relative; z-index:2}
#menu > li { float:left; position:relative;}
#menu > li > a{ display:block; width:115px; background:url(../images/menu_bg.gif) top repeat-x; font-size:15px; color:#fff; text-transform:uppercase; line-height:46px; text-decoration:none; text-align:center; letter-spacing:-1px;}
#menu > li > a:hover{ text-decoration:none}
#menu > li > a span{ display:block; background:url(../images/menu_left.gif) 0 0 no-repeat}
#menu > li > a span span{ background:url(../images/menu_right.gif) right 0 no-repeat}
#menu > li:hover > a, #menu > .active > a{ background:url(../images/menu_bg_active.gif) top repeat-x}
#menu > li:hover > a span, #menu > .active > a span{ background:url(../images/menu_left_active.gif) 0 0 no-repeat}
#menu > li:hover > a span span , #menu > .active > a span span{ background:url(../images/menu_right_active.gif) right 0 no-repeat} 

.submenu{ position:absolute; top:47px; left:0; background:url(../images/bg_submenu.gif) top repeat-x #101010; border-bottom:1px solid #000; width:114px; border-right:1px solid #000}
.submenu li{ line-height:43px; font-size:15px;}
.submenu a{ display:block; color:#fff; text-transform:uppercase; text-decoration:none; text-align:center; letter-spacing:-1px}
.submenu a:hover{ text-decoration: none; background:url(../images/bg_submenu_active.gif) top repeat-x #cccccc; color:#000}

#menu ul{ display:none}

.bg_slider{ background:url(../images/bg_slider.gif) 0 0 repeat-x; border-top:1px solid #333333; border-left:1px solid #262626; height:276px; position:relative; z-index:1; box-shadow: 0 0 5px rgba(0, 0, 0, .75); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, .75); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, .75); margin-right:2px;}
.slider{ position:relative; top:8px; left:6px; height:257px; width:100%;}
.items{ display:none}

.pagination{ position:absolute; top:240px; left:165px; z-index:2}
.pagination li{ float:left; padding-right:4px;}
.pagination a{ display:block; width:17px; height:17px; background:url(../images/buttons.png) right 0 no-repeat; text-indent:-9999px;}
.pagination a:hover, .pagination .current a{ background-position:left;}


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

#content{ height:506px; padding:0 29px; position:relative; z-index:1}
#page1 #content{ height:240px;}

.col1{ width:263px; float:left;}
.col2{ width:187px; float:left;}
#page3 .col1{ width:240px;}

.pad_left1{ padding-left:10px;}
.pad_bot1{ padding-bottom:6px}

.font1{ color:#fff; font-size:14px;}
.font2{ font-size:15px; line-height:20px !important; color:#fff; text-transform:uppercase; padding-bottom:12px; margin-top:-4px; letter-spacing:-1px;}
.font2 a:hover{ text-decoration:none; color:#5a5a5a}
#page3 .font1, #page5 .font1{ margin-top:-4px; padding-bottom:10px;}


.box{ background:url(../images/bg_box1.png) 0 0 repeat; border-top:1px solid #1a1a1a; border-left:1px solid #1a1a1a;box-shadow:1px 1px 3px rgba(0, 0, 0, .75); -moz-box-shadow:1px 1px 3px rgba(0, 0, 0, .75); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, .75); position:relative; margin-bottom:4px;}
#page4 .box{ padding:23px 29px 0 19px;}

#gallery1{ float:left;}
#gallery1 li{ float:left;}
#gallery1 a{ height:123px; border-left:1px solid #1a1a1a; text-align:center; display:block; padding:8px 0 0 0; font-size:19px; line-height:1.2em; width:69px;}
#gallery1 a:hover, #gallery1 .selected a{ text-decoration:none;background: url(../images/bg_box2.png) 0 0 repeat;}
#gallery1 a strong{ display:block; margin-top:-2px; text-transform:uppercase; font-size:12px; line-height:1.2em;}
#gallery1 a > span{ color:#5a5a5a; font-size:14px; line-height:1.2em; padding:13px 0 0 0; display:block}
#gallery1 a > span span{ display:block; margin-top:-3px;}
#gallery1 a:hover > span, #gallery1 .selected a > span{ color:#fff}

.tab-content{ padding:19px 19px 11px 19px}
.tab-content p{ padding-bottom:10px;}

.hide{ display:none}

.prev, .next{ float:left; padding:45px 7px 48px 6px; display:block;}
.next{ border-left:1px solid #1a1a1a;}
.prev:hover, .next:hover{ background: url(../images/bg_box2.png) 0 0 repeat;}

#page1 .col1 .box{ height:131px;}

#gallery2{ width:412px; position:relative; padding-right:50px; height:387px !important;}
#gallery2 li{ padding-bottom:15px;}
#gallery2 p{ line-height:18px;}

#page3 #gallery2 .img1{ margin-right:27px;}
#page3 #gallery2{ height:140px !important}

#page4 #gallery2{ height:auto !important; width:469px !important; padding-right:0; margin-top:-42px; padding-top:42px;}
#page4 #gallery2 li{ width:224px; margin-right:16px; overflow:inherit !important}

.img1{ float:left; margin-right:17px}
.img2{ float: right; margin-left:17px}

.prev2, .next2{ position:absolute; top:0; right:0px; width:23px; height:7px; display:block; background:url(../images/markers.png) 0 -10px no-repeat}
.next2{ top:26px; background-position:0 -36px;}
.prev2:hover{ background-position:0 0}
.next2:hover{ background-position:bottom}

#page4 .prev2, #page4 .next2{ position:absolute; top:0px; right:27px; width:7px; height:23px; display:block; background:url(../images/markers2.png) -10px 0 no-repeat}
#page4 .next2{ right:4px; background-position:-36px 0;}
#page4 .prev2:hover{ background-position:0 0}
#page4 .next2:hover{ background-position: right}

.underline{ border-bottom:1px solid #282828; margin-bottom:24px}

/* ============================= footer ====================== */

footer { padding: 6px 28px; height:0}
footer a{}
footer a:hover{}

#icons{ float:right; padding: 0 0 0 0; line-height:22px; color:#7b7b7b}
#icons li{ float:left; padding-left:8px;}
#icons .first{ padding-right:2px;}

/* Tooltips */
.aToolTip { background: url(../images/bg_box2.png) 0 0 repeat; border:1px solid #000; color:#fff;	margin:0; padding:2px 10px 3px; font-size:11px; line-height:1.2em; position: absolute;}
.aToolTip .aToolTipContent { position:relative;	margin:0; padding:0;}

/* ============================= forms ============================= */
