/* Resets
-------------------------------------------------------------- */
* { margin: 0; padding: 0; }
img { border: none; }


/* Typography
-------------------------------------------------------------- */
h1, h2, h3, h4 { font-weight: bold;  }
h1 { font-size: 42px; text-transform: uppercase; letter-spacing: -1.5px; margin: 15px 0; line-height: 40px; color: #000; text-shadow: 0px 1px 1px #ccc; }
h2 { font-size: 18px; text-transform: uppercase; margin: 15px 0; }
h3 { font-size: 16px; color: #6d89c5; margin: 10px 0;  }
h4 { font-size: 14px; }
hr { margin: 20px 0;  }


/* HTML Elements
-------------------------------------------------------------- */
body { font-size: 12px; font-family: Helvetica, Arial, sans-serif; background: url(../imgs/bg-body.jpg) top left repeat-x; }
p { margin: 0 0 10px; }
a { color: #6d89c5; text-decoration: none; }
a:hover { text-decoration: underline; }

/* Some Classes
-------------------------------------------------------------- */
.clear { clear: both; }
.mid { vertical-align: middle; }
.small { font-size: 11px; color: #666; }
ul.picthumb { height: 240px; }
ul.picthumb li { width: 100px; height: 100px; border: 1px solid #ccc; display: inline; list-style: none; float: left;  margin: 5px; }
.bold { font-weight: bold; }
.bolder { font-weight: bold; font-size: 15px; }
.send { width: auto; height: auto; background: url(../imgs/icon-ecard.jpg) center left no-repeat; }
.fb { width: auto; height: auto; background: url(../imgs/icon-fb.gif) center left no-repeat; }
.padleft { padding-left: 80px; }
.border { border-left: 1px solid #ccc; }
ul.genlist { margin-left: 20px; line-height: 18px; }

/* Page Elements
-------------------------------------------------------------- */
#errors { display: block; min-height: 10px; padding: 5px; color: #fff; background: red; }

body#prizes #maincontent { background: url(../imgs/bintan-map.gif) bottom center no-repeat #cce1fe; position: relative; height: 950px;  }

#wrapper { width: 960px; height: auto; margin: 0 auto; }
#header { width: 960px; height: auto;  position: relative; }
#header .logo { height: 350px; margin: 0 20px; position: relative; top: 10px; left: 20px; }
#header .headerpics { height: 350px; margin-right: 60px; position: absolute; right: 10px; z-index: -1; top: 0;  }
#header .eventdate { width: 300px; height: auto;  position: absolute; left: 80px; bottom: -65px; text-align: center; }
#header .eventdate h2 { margin-bottom: 2px; text-shadow: 0px 1px 1px #fff; }

#nav { width: 890px; height: 30px; border-bottom: 1px solid #ccc; margin: 55px 0 20px 0; text-align: right;  }
#nav ul.navi li { display: inline; list-style: none; margin: 0 20px;   }
#nav ul.navi li a { padding: 5px 10px; font-weight: bold; color: #666; font-size: 14px; text-shadow: 0px 1px 1px #fff;   }
#nav ul.navi li a:hover { color: #000; padding: 5px 10px; text-decoration: none; text-shadow: 0px 1px 1px #fff; }
#nav ul.navi li a:active { color: #666; }


body#main #nav ul.navi li a.main, body#gallery #nav ul.navi li a.gallery, body#prizes #nav ul.navi li a.prizes, body#login #nav ul.navi li a.login { background: #6d89c5; color: #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0px 1px 1px #000; }
 

#maincontent { width: 500px; height: auto; float: left; margin-bottom: 30px; }
#maincontent .featured { text-align: center; } 
#prizecontent { width: 940px; height: 1220px;  position: relative; background: url(../imgs/bintan-map.png) bottom center no-repeat; }
#prizecontent .prized { width: 420px; height: auto; float: left; margin: 0 0 20px 20px; padding: 10px; }
#prizecontent .sponsors { clear: both; border-top: 1px dashed #ccc; }
#prizecontent .sponsordetails { width: 260px; float: left; margin-left: 30px; }
#prizecontent .sponsors p { font-size: 11px; }

#sidebar { width: 420px; height: auto;  float: right; margin-bottom: 20px; padding-right: 30px; }
#sidebar .feature { clear: both; border-top: 1px solid #ccc; padding: 10px 0; }
#sidebar .content { width: auto; height: auto; }
#sidebar .ads { width: 420px; height: auto; border-top: 1px solid #ccc; }
#sidebar .adspace { width: 180px; height: auto; padding: 5px 15px; float: left; }
#sidebar .adspace p { color: #666; font-size: 10px; }
#sidebar .adspace h4,p { margin-top: 5px; }

#maingallery { width: 800px; height: auto; margin: 0 auto; }
#maingallery .adbanners { width: auto; margin-right: 18px; float: left; padding-bottom: 20px; }
#maingallery .adbanners img { border: 1px solid #ccc; }
#maingallery .photocontainer { border-top: 1px solid #ccc; padding-top: 10px; height: 360px; }
#votegallery { width: 840px; height: auto; margin: 0 auto; }
#picholder { width: 660px; height: auto; padding: 20px 10px; border: 1px solid #ccc; -moz-border-radius: 8px; -webkit-border-radius: 8px; margin: 0 auto; text-align: center; position: relative; }
#picholder .pic { width: 640px; min-height: 400px; margin: 0 auto; position: relative; }
#picholder .pic img { margin-bottom: 25px; }
#picholder .vote { width: auto; height: auto; position: absolute; bottom: 5px; right: 50px; }
#picholder .vote input { width: 120px; height: 45px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #6d89c5; padding: 10px; font-size: 20px; font-weight: bold; text-transform: uppercase; color: #fff; cursor: pointer; }
#picholder .vote input:hover { background: #6d89c5; }
#picholder .ecard { width: auto; height: auto; text-align: left; margin-left: 20px;	  }
#votegallery .recents { width: 680px; height: 140px; padding: 10px; margin: 20px auto;  }

#generic { width: 800px; height: auto; padding: 10px 20px;}
#generic p,ul { font-size: 11px; }
#generic ul { margin-left: 30px; }
#generic ul li { margin-bottom: 20px; }
#generic h3 { margin: 20px 0; border-bottom: 1px dashed #ccc;  }

#footer { clear: both; width: 960px; height: 90px; border-top: 1px solid #ccc; margin: 20px 0 40px 0; background: url(../imgs/logo-bintan-small.gif) bottom right no-repeat; }
#footer p { margin-top: 10px; color: #666; font-size: 10px; }


/* Tabs
-------------------------------------------------------------- */


ul.tabs {  list-style:none;  margin: 0 !important;  padding: 0;	 height: 40px; }
ul.tabs li {  float:left; text-indent:0; padding: 0; margin:0 !important; list-style-image:none !important; }
ul.tabs a { font-size: 12px; display: block; height: 16px; width: 20px; text-align: center; text-decoration:none; color: #666; padding: 4px; position:relative;  }
ul.tabs a:active { outline: none; }
ul.tabs a:hover { color: #6d89c5; }

ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {-moz-border-radius: 6px; -webkit-border-radius: 6px; background: #6d89c5; cursor:default !important;  color:#fff !important; }

div.panes div.pane { display:none; }


/* Login Form
-------------------------------------------------------------- */
#loginpane { width: 380px; height: 300px; padding: 0 20px 20px 30px; float: left; margin-bottom: 30px; }
form.users textarea { width: 200px  }
form.users p { margin: 20px 0 0 10px; font-size: 14px; }
form.users p label { float: left; width: 140px; margin-top: 10px; }
form.users p input { width: 200px; height: 30px; font-size: 14px; background: #fff; border: 1px solid #ccc; }
form.users p input:hover { background: #efefef; border: 1px solid #ccc; } 
form.users .login { width: 120px; height: 35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #6d89c5; padding: 6px; font-size: 18px; font-weight: bold; text-transform: uppercase; color: #fff; cursor: pointer; }
form.users .login:hover { background: #6d89c5; }

.upload { width: 120px; height: 35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #6d89c5; padding: 6px; font-size: 18px; font-weight: bold; text-transform: uppercase; color: #fff; cursor: pointer; }
.upload:hover { background: #6d89c5; }

/* Upload Photos
-------------------------------------------------------------- */
#uploadspane { width: 320px; height: 500px; float: left;  }
#photolist { width: 480px; height: auto; float: left;  }
ul.myphotos li { width: 100px; height: 100px; border: 1px solid #ccc; display: inline; list-style: none; float: left;  margin: 5px 5px 20px 5px; }
ul.myphotos p { margin-top: 3px; }


/* Accordion 
-------------------------------------------------------------- */
.menu_list { width: 600px; margin-top: 1px; 	}
.menu_head { cursor: pointer; position: relative; color: #6d89c5; text-decoration: underline; }
.menu_head:hover { color: #666; text-decoration: none; }
.menu_body { display: none; padding-top: 10px; }
.menu_body p { margin: 10px 0 0 10px; font-size: 14px; }
.menu_body p label { float: left; width: 100px; margin-top: 10px; }
.menu_body p input { height: 30px; width: 200px; font-size: 18px; }
.sendecard  { width: 80px; height: 35px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #6d89c5; padding: 6px 10px 10px; font-size: 16px; font-weight: bold; text-transform: uppercase; color: #fff; cursor: pointer; margin: 10px 0 0 110px; }
.sendecard:hover { background: #000; }