/**
 * Name: Mycard
 * Version: 0.1 
*/

/*=======================================================
RESET, GENERAL & LAYOUT
=======================================================*/
html {color:#404040;background:#F5F5F5;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td {margin:0;padding:0;}
table {border-collapse:collapse;border-spacing:0;}
img {border:0;}
ul,ol {list-style:none;}
a{text-decoration:none;color:#808080;}
a:hover{color:#404040;}
caption,th {text-align:left;}
address,caption,cite,code,dfn,th,var,optgroup {font-style:inherit;font-weight:inherit;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}
abbr,acronym {border:0;font-variant:normal;}
sup,sub,small{font-size:85%;}
code,kbd,samp,tt {font-size:100%;}
input,button,textarea,select,optgroup,option {font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}
input[type="submit"],input[type="button"],button{text-transform: uppercase;}
/* input,button,textarea,select {*font-size:100%;}*/
:focus {outline:0;}
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix { display: inline-block;}
* html .clearfix { height: 1%;}
.clearfix { display: block;}
fieldset { border:1px solid #B2B2B2; padding: 1em; margin-top:1em; }
legend { border:1px dotted #B2B2B2; color:black; font-size:0.9em; padding:0.3em 1em; }


body{background:#F5F5F5;color:#404040;font-family:Arial,Verdna,Tahoma,Sans-serif;font-size:12px;}
#header,#mainnav,.panel-inner,#slider,.footer-inner,.copyright{width:940px;margin:0 auto;padding:0 10px;}

/**
 * box
 */
#main{ width: 848px; padding: 20px 10px 45px; margin: 0 auto; position:relative; z-index:100; }

.f-right {float:right !important;}
.padding3_5 {padding:3px 5px;}
.success {color:green;}
.failure {color:red;}

h1.main {color:#AF7532; font-size:180%;}
h2.main {color:#AF7532; font-size:160%;}
h3.main	{color:#AF7532; font-size:140%;}
h4.main {color:#AF7532; font-size:120%;}
.title {margin: 10px 0pt; background: transparent url('/ximages/title.gif') repeat-x scroll 0pt 50%;}
.title span {padding: 0pt 5px; background: #F5F5F5 none repeat scroll 0% 0%; margin-left: 10px;}
.input-text, .input-area { border-style: solid; border-color: #B0B0B0 #E0E0E0 #E0E0E0 #B0B0B0; width:290px; border-width: 1px; padding: 3px; font-size: 100%; font-family: Arial,Verdna,Tahoma,Sans-serif; }
.input-area { width: 600px; height: 150px; }
.va-top { vertical-align: top ! important; }

p.main {line-height:150%; margin-bottom:8px;}
td.main {padding:5px;}

.nom {margin:0;}
.nomt {margin-top:0;}
.nomb {margin-bottom:0;}

.nohigh {font-weight:bold; color:#808080;}

.margin15 {margin:15px 0;}

.box {width:850px; padding:15px 0 0 40px; background:url("../ximages/box.gif") 0 0 repeat-y;}
.box-top {width:850px; height:6px; background:url("../ximages/box-top.gif") 0 0 no-repeat; font-size:0; line-height:0;}
.box-bottom {width:850px; height:8px; margin-bottom:18px; background:url("../ximages/box-bottom.gif") 0 0 no-repeat; font-size:0; line-height:0;}
.box, .box-top, .box-bottom { margin-left: 1px; }
.box .col {position:relative; float:left; width:300px; padding-bottom:17px; margin-bottom:-6px; z-index:100; background-position:100% 100%; background-repeat:no-repeat;}
.box .col .in {min-height:20px; height:auto;}
.box .col h1 {color: #404040; font-size: 2.5em;}
.box .col h2, .box .col h4 {color: #404040;}

/*=======================================================
HEADER
=======================================================*/
#header{margin:20px auto 30px auto;position:relative;padding:30px 0 0 0;}
.logo a{width:213px;height:40px;display:block;text-indent:-5555em;overflow:hidden;background:url(../ximages/logo.png) no-repeat left top;}

.login-link,.logout{height:20px;line-height:20px;position:absolute;top:0;right:10px;font-size:11px;}
.login-link span{float:right;}
.login-link span.expand{cursor:pointer;width:82px;height:20px;display:block;text-indent:-5555em;overflow:hidden;background:url(../ximages/login_link_button.png) no-repeat left top;margin:0 0 0 10px;}
.login-link span.collapse{background:url(../ximages/login_form.png) no-repeat right top;}

.login-box{display:none;position:absolute;top:19px;right:10px;color:#FFF;width:160px;}
.login-box a{color:#FFF;}
.login-box a:hover{color:#404040;}
.login-box form{background:url(../ximages/login_form.png) no-repeat left -20px;width:140px;padding:10px 10px 0;}
.login-bottom{height:10px;background:url(../ximages/login_form.png) no-repeat left bottom;}
* html .login-box form{background:url(../ximages/login_form.gif) no-repeat left -20px;}
* html .login-bottom{background:url(../ximages/login_form.gif) no-repeat left bottom;}
.login-box p.inlabel{display:block;position:relative;height:16px;margin:0 0 8px 0;overflow:hidden;background:#FFF;color:#808080;}
.login-box p.inlabel label{position:absolute;top:0;left:5px;background:#FFF;}
.login-box p br{display:none;}
.login-box p.inlabel input{display:block;background:#FFF;border:0;width:130px;height:14px;padding:1px 5px;}
.login-box input#login_submit{background:url(../ximages/login_button.png) no-repeat left top;width:59px;height:23px;border:0;cursor:pointer;text-transform:uppercase;color:#FFF;font-weight:bold;font-size:11px;overflow:hidden;vertical-align:middle;}
.login-box input#remember{vertical-align:middle;border:0;margin:0 0 0 2px;}
.login-box input#login_submit:hover{background-position:0 -23px;}
.login-box p.login-tips{color:#FFF;font-size:11px;padding:6px 0 0 0;}

/*=======================================================
MAINNAV
=======================================================*/
#mainnav{height:27px;font-size:13px; text-transform: uppercase;}
#mainnav ul{padding:0 0 0 240px;}
#mainnav ul li{float:left;margin:0 11px 0 0;}
#mainnav ul li a{float:left;display:block;height:27px;background:#F5F5F5 url(../ximages/menu_bg.png) no-repeat left top;padding:0 0 0 18px;color:#FFF;}
#mainnav ul li a:hover{color:#AF7532;}
#mainnav ul li a span{float:left;display:block;height:27px;line-height:27px;background:#F5F5F5 url(../ximages/menu_bg.png) no-repeat right top;padding:0 18px 0 0;cursor:pointer;}
#mainnav ul li.active a{color:#AF7532;}
#mainnav ul li.active a{background-position:left -27px;}
#mainnav ul li.active a span{background-position:right -27px;}

/*=======================================================
PANEL
=======================================================*/
#panel{background:#262626 url(../ximages/panel_bg.png) repeat-x left top;color:#FFF;}
.panel-inner{padding:10px;background:url(../ximages/panel_shadow.png) no-repeat 750px top;}

.panel-menu{width:220px;float:left;}
.panel-menu ul li {}
.panel-menu ul li a{color:#FFF;text-transform:uppercase;font-size:13px;height:32px;line-height:32px;background:url(../ximages/panel_icon.png) no-repeat left top;display:block;padding:0 0 0 42px;}
.panel-menu ul li a:hover,.panel-menu ul li.active a{color:#AF7532;}
* html .panel-menu ul li a{background:url(../ximages/panel_icon.gif) no-repeat left top;}
.panel-menu ul li.rest a{background-position:0 0;}
.panel-menu ul li.person a{background-position:0 -32px;}
.panel-menu ul li.over a{background-position:0 -64px;}
.panel-menu ul li.service a{background-position:0 -96px;}
.panel-menu ul li.shop a{background-position:0 -128px;}
.panel-menu ul li.cafe a{background-position:0 -160px;}
.panel-menu ul li.under a{background-position:0 -192px;}

.panel-content{width:460px;float:left;padding:0 20px;}
.panel-content h2{font-size:30px;color:#af7532;margin:20px 0 20px 0;font-weight:normal; text-transform: uppercase;}
.panel-content p{margin:0 0 30px 0;line-height:166.7%;}
.panel-form{width:460px;height:70px;background:url(../ximages/panel_wcbg.png) no-repeat left top;}
* html .panel-form{background:url(../ximages/panel_wcbg.gif) no-repeat left top;}
.panel-form form{margin:0 auto;padding:24px 0 0 20px;}
.panel-form label{text-transform:uppercase;font-size:14px;color:#262626;font-weight:bold;display:block;float:left;background:#FFF;line-height:20px;}
.panel-form select{display:block;/* background:url(../ximages/panel_dropdown.png) no-repeat left top;color:#A0A0A0;border:0; */width:112px;height:20px;float:left;margin:0 20px;}
.panel-form input#submit{width:45px;height:20px;display:block;text-indent:-5555em;overflow:hidden;background:url(../ximages/panel_submit_button.png) no-repeat left top;border:0;float:left;cursor:pointer;}

/* Stylish Select, Replace a select drop down box with a stylable unordered list */
.js ul.newList {left:-9999px;}
.newListSelected {float:left;width:102px; height:20px; color:#000; padding:0 0 0 10px;background:#FFF url(../ximages/panel_dropdown.png) no-repeat left top;margin:0 20px;color:#A0A0A0;z-index:999;}
.selectedTxt {width:82px; height:20px; padding:0 20px 0 0;overflow:hidden;line-height:20px;}
ul.newList {background:#FFF; position:absolute; border:1px solid #DDD;top:20px !important;left:0; overflow:auto; z-index:999;width:100px;margin:0 5px;}
ul.newList li {padding:2px 3px;}
ul.newList li:hover{background:#DDD;}
ul.newList li.hiLite{background:#AF7532;color:#FFF;}

.panel-logo{width:200px;padding:20px 0 0 0;float:right;text-transform:uppercase;font-size:14px;font-weight:bold;text-align:center;}
.panel-logo a{display:block;}
.panel-logo a:hover{color:#FFF;}
.panel-logo a.facebook span{width:112px;height:112px;text-indent:-5555em;overflow:hidden;display:block;margin:0 auto;background:url(../ximages/facebook_logo.png) no-repeat center top;}

/*=======================================================
SLIDER
=======================================================*/
#slider{padding:0 10px;margin:20px auto;position:relative;z-index:100;position:relative;z-index:100;}
#slider ul{margin:0 auto;z-index:100;width:256px;overflow:hidden;}
#slider ul li{z-index:101;height:260px;}
#slider ul li a{position:relative;display:block;height:260px;}
#slider ul li a span{position:absolute;background:url(/ximages/slider_textbg.png) no-repeat left top;bottom:50px;left:0;width:870px;font:bold 28px Arial, Helvetica, verdana, Sans-serif;color:#FFF;text-transform:uppercase;padding:0 30px;height:50px;line-height:50px;}
#slider #prev,#slider #next{width:55px;height:236px;display:block;text-indent:-5555em;overflow:hidden;position:absolute;top:10%;z-index:103;cursor:pointer;}
/* #slider #prev,#next{width:55px;height:236px;display:block;text-indent:-5555em;overflow:hidden;position:absolute;top:10%;z-index:103;cursor:pointer;} */
#slider #prev{left:0;background:url(../ximages/slider_prev.png) no-repeat left top;}
#slider #next{right:0;background:url(../ximages/slider_next.png) no-repeat right top;}

#slider #mctl,
#slider #mctr,
#slider #mcbl,
#slider #mcbr{background:url(../ximages/mask_corner.png) no-repeat 0 0;display:block;width:12px;height:12px;position:absolute;z-index:999;}
* html #slider #mctl,
* html #slider #mctr,
* html #slider #mcbl,
* html #slider #mcbr{background-image:url(../ximages/mask_corner.gif);}
/* 
45px = (#slider width(940px)+ #slider padding width(10px*2) - #slider ul width(870px)) / 2 
245px = 
*/
#slider #mctl{left:45px;top:0;background-position:left top;}
#slider #mctr{right:45px;top:0;background-position:right top;}
#slider #mcbl{left:45px;bottom:0;background-position:left bottom;}
#slider #mcbr{right:45px;bottom:0;background-position:right bottom;}
* html #slider #mcbl,* html #slider #mcbr{top:245px;}


/*=======================================================
FOOTER
=======================================================*/
#footer{clear:both;background:#AAA url(../ximages/footer_bg.png) repeat-x left top;color:#808080;}
.footer-inner{padding:15px 10px;background:url(../ximages/footer_shadow.png) no-repeat 630px top;}
#footer dl{width:140px;float:left;margin:0 15px 0 0;}
#footer dt,
#footer h3{text-transform:uppercase;font-size:14px;margin:0 0 20px 0; font-weight: normal;}
#footer dd{padding:0 0 4px 0;}
#footer dd a{color:#808080;}

.about{width:300px;float:right;}
.about p{margin:0 0 20px 0;line-height:166.7%;}

.copyright{padding:10px 0 20px 0;border-top:1px solid #929292;}