/*
Theme Name: ALSA
Author: Arini Astari & Anindra Adani
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

body {
	height:100%;
	font-family:Kalinga, Arial;
	color:#3a3a3a;
	background:url(images/bg-rep.jpg) repeat;
}

.background {		
	background:url(images/bg.jpg) repeat-x;
	min-height:928px;
	clear:both;
}

a {
	color:#3A3A3A;
	text-decoration:none;
}

img {
	border:none;
}

p {
	font-size:12px;
}

h3 {
	font-size:12px;
	padding-bottom:3px;
}

ul {
	list-style:none;
}

.left, .alignleft {
	float:left;
}

.right, .alignright {
	float:right;
}

.alignleft, .alignright {
	padding:5px;
	padding-bottom:0px;
}

.container {
	width:960px;
	margin:0 auto;
	clear:both;
}

/** SIDEBAR */
.sidebar {
	width:290px;
	position:fixed;
	clear:both;
}

.sidebar .twitter {
	width:285px;
	height:auto;
	padding-bottom:5px;
	clear:both;
}

.twitter p {
	text-align:center;
	background:#FFF;
	color:#3a3a3a;
	padding:12px;
	margin-top:-10px;
	border:#8d8d8d solid 1px;
	font-family:"myriad Pro", "Arial Black";
	-moz-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;	
	-moz-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
}

img.logo {
	margin-top:15px;
}

.sidebar .nav {	
	width:168px;		
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float:right;
	margin-top:10px;
	margin-bottom:10px;
}

.nav li {
	text-align:center;
	font-family:"myriad Pro", "Arial Black";
	display:block;
	background:url(images/selector.png) bottom no-repeat;
}

.nav li:last-child {
	background:none;
}

.nav a {
	margin-left:7px;
	width:143px;
	border:#7e7e7e solid 1px;
	border-bottom:none;
	border-top:none;
	*margin-top:-4px;
	padding:5px;
	background:url(images/bg_nav.png);
	display:block;
	color:#3A3A3A;
}

.nav li:first-child a {
	border-top:#7e7e7e solid 1px;
	-moz-border-radius-topright: 4px;
	-webkit-border-top-right-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-webkit-border-top-left-radius: 4px;
	*margin-top:0px;
}

.nav li:last-child a {
	border-bottom:#7e7e7e solid 1px;
	-moz-border-radius-bottomright: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
}

.nav li.lastnav a{
	border-bottom:#7e7e7e solid 1px;
}

ul#nav2 {
	height:145px;
}

.nav li:hover, .nav li.selected {
	background:url(images/active-nav.png) no-repeat;
	color:#FFF;
}

.nav li:hover a, .nav li.selected a {
	background:none;
	border:none;
	color:#FFF;
}

.nav li:last-child:hover a, .nav li.lastnav:hover a, .nav li:last-child.selected a, .nav li.lastnav.selected a {
	border-bottom:#7e7e7e solid 1px;
}

.sidebar .login {
	background:url(images/bg-box.png);
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	float:left;
	margin-top:10px;
	width:120px;
	height:146px;
}

/** SIGN UP & LOGIN */

#alw_login{
	width:110px;
	height:132px;
	margin:5px;
	margin-top:10px;
	overflow:hidden;	
}

#alw_login p {
	font-family:"myriad Pro", arial;
	color:#3a3a3a;
	margin:5px o;
}

#alw_register {
	background:url(images/bg-box.png);
	margin-top:10px;
	height:135px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	padding:5px;
	width:270px;
}
input[type="text"], input[type="password"]{
	border:#8e8e8e 1px solid;
	background:url(images/bg-input.png); !important
	color:#fff;
}

input:-webkit-autofill{
background:url(images/bg-input.png);
color: black;
}

.opt {
	clear:both;
	background:url(images/bg-box.png);
	width:285px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	text-align:center;
}
/** CONTENT */
.content {
	float:right;
	width:650px;
	background:#FFF;
	height:100%;
	padding:10px;
	padding-top:0px;
	margin-right:-10px;
	clear:both;
}

.content h1 {
	color:#800b0b;
	font-size:48px;
	font-family:"letter Gothic Std", Arial;
}

#newsevents, #aboutus {	
	padding:10px 0;
}

#aboutus li img {
	width:228px;
	padding:5px;
	height:120px;
	border:solid 1px #D6AFAF;
}
.news {
  width: 640px;
  position: relative;
  padding:5px;
}

.news .wrapper {
  width: 630px; /* .news width - (.wrapper margin-left + .wrapper margin-right) */
  overflow:visible;
  min-height: 10em;
  margin: 0 5px;
  position:relative;
  top: 0;
}

.news .wrapper ul {
  width: 9999px;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0 auto;
  padding:0;
  position: absolute;
  top: 0;
}
.slideshow {
	padding-bottom:10px;
}

.slideshow, .slideshow img {
	width:640px;
	height:192px;
}
.news ul li {
	display:block;
	float:left;
	width:187px;
	padding:10px;
	line-height:1em;
	background:url(images/news-divider.png) right top no-repeat;
	height:auto;
	text-align:justify;
}

.news ul li.empty {
	background:none;
}
.news ul li h2 {
	font-size:14px;
}

.news .arrow {
  display: block;
  height: 22px;
  width: 12px;
  text-indent: -99999px;
  position: absolute;
  top: 70px;
  cursor: pointer;
}

.news .forward {
  background:url(images/arrow-fw.png) no-repeat;
  right: 2px;
}

.news .back {
  background:url(images/arrow-back.png) no-repeat;
  left: 0;
}

.content .events {
	width:600px;
	border:#989898 2px solid;
	clear:both;
	padding:10px;
	padding-bottom:15px;
	display:block;
	min-height:110px;
	z-index:0;
	margin:5px;
	*padding-bottom:13px;
}

.events h2 {
	text-transform:uppercase;
	font-style:italic;
	float:left;
}

.events h3 {
	text-align:right;
}

.events p {
	padding-top:10px;
	*text-indent:0px;
}
.events img {
	float:left;
	padding-right:10px;
	width:134px;
	height:117px;
}

/** GALLERY */
#gallery, #merchandise, #HRD {
	padding:10px 0;
	clear:both;
	height:auto;
}

#HRD, #gallery {
	margin:0 auto;
}

.gallery-box {
	border:#ac6060 1px solid; 
	height:190px; 
	width:270px; 
	float:left;
	margin:5px 10px;
}
				
.boxgrid{ 
	width: 250px; 
	height: 168px; 
	margin:10px; 
	overflow: hidden; 
	position: relative;
}

.boxgrid img{ 
	position: absolute; 
	top: 0; 
	left: 0; 
	border: 0;
	width:250px;
	height:168px;
}
.boxgrid p{ 
	padding: 0 10px; 
	color:#afafaf; 
	font-weight:bold; 
	font:10pt "Lucida Grande", Arial, sans-serif; 
}
			
.boxcaption{ 
	float: left; 
	position: absolute; 
	background: #3a3a3a; 
	height: 100%; 
	width: 100%; 
	opacity: .8; 
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
.captionfull .boxcaption {
	top: 260;
	left: 0;
}
.caption .boxcaption {
	top: 220;
	left: 0;
}

.captiontes {
	background:#FFF;
	height:60px;
	width:100%;
	position:absolute;
	overflow:hidden;
}


/* GALLERY LIST */
/* IMPORTANT - Change '#photos' to the ID of your gallery list to prevent a flash of unstyled content */
#photos { visibility: hidden; }

/* GALLERY CONTAINER */
.gallery { background: #ddd; border: 1px solid #aaa; padding: 5px;}

/* LOADING BOX */
.loader { background: url(loader.gif) center center no-repeat #ddd; }

/* GALLERY PANELS */
.panel {}

/* DEFINE HEIGHT OF PANEL OVERLAY */
/* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */
.panel .panel-overlay,
.panel .overlay-background { height: 60px; padding: 0 1em; }

/* PANEL OVERLAY BACKGROUND */
.panel .overlay-background { background:#FFF; }

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay { color:#000; font-size: 0.7em; }
.panel .panel-overlay a { color:#000; text-decoration: underline; font-weight: bold; }

/* FILMSTRIP */
/* 'margin' will define top/bottom margin in completed gallery */
.filmstrip { margin: 5px;  }

/* FILMSTRIP FRAMES (contains both images and captions) */
.frame {}

/* WRAPPER FOR FILMSTRIP IMAGES */
.frame .img_wrap { border: 1px solid #aaa; }

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.frame.current .img_wrap { border-color: #d6afaf; }

/* FRAME IMAGES */
.frame img { border: none; }

/* FRAME CAPTION */
.frame .caption { font-size: 11px; text-align: center; color: #888; }

/* CURRENT FRAME CAPTION */
.frame.current .caption { color: #3a3a3a; }

.pointer {
	border-bottom-color:transparent;
}
 /* GALLERY CONTAINER */
.gallery { background: #fff;
           border: 1px solid #d6afaf; 
           padding: 5px;}

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay { color:#3a3a3a;
                        font-size: 0.8em; }
						
#HRD h1 {
	font-size:40px;
}

.footer {
	width:100%;
	background:#3a3a3a;
	clear:both;
	z-index:100;
	height:40px;
	position:fixed;
	bottom:0;
}

.footer ul {
	float:right;
	margin-top:10px;
}

.footer li {
	float:left;
	color:#FFF;
	padding:0px 10px;
}

.footer li a {
	color:#FFF;
}

.chatbox-panel {
	position: fixed;
	top: 120px;
	right: 0;
	display: none;
	background: none;
	height: auto;
	filter: alpha(opacity=85);
	opacity: .85;
	z-index:200;
}

a.trigger{
	position: fixed;
	text-decoration: none;
	top: 80px; right: 0;
	font-size: 16px;
	letter-spacing:-1px;
	font-family: verdana, helvetica, arial, sans-serif;
	color:#fff;
	padding: 5px;
	font-weight: 700;
	background:#333333;
	border:1px solid #444444;
	-moz-border-radius-topleft: 20px;
	-webkit-border-top-left-radius: 20px;
	-moz-border-radius-bottomleft: 20px;
	-webkit-border-bottom-left-radius: 20px;
	display: block;
	z-index:210;
}

.bubbleInfo {
    position: relative;
}

.popup {
    position: absolute;
    display: none; /* keeps the popup hidden if no JS available */
	background:#FFF;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
}

.popup p {
	padding:5px;
}

.formBuilderLabelRequired {
	color:#FFF;
}