/*
* CSS for Garena Talk Website
* Last Update 15/03/13 by Zul
*/

/* Basics */
*{outline:0;border:0;margin:0;padding:0}
body{font-family:'Open Sans','Arial';font-size:1em;color:#000}
a{color:#333;text-decoration:none}
a:hover{text-decoration:underline}
li{list-style:none}

/* float clearing for IE6 */
* html .clear {
  height: 1%;
  overflow: visible; }

/* float clearing for IE7 */
*+html .clear {
  min-height: 1%; }

/* float clearing for everyone else */
.clear:after {
  clear: both;
  content: ".";
  display: block;
  height: 0;
  visibility: hidden; }

/* Header */
#globalHeader{ width:980px; margin:0 auto; height:85px;}
#globalHeader h1{ float:left; margin:5px 0 0 0;}

/* Navigation */
.nav {
	display:block; float:right; margin:22px 0 0; border:1px solid #ccc;
	background:#eee;
	background:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* Safari 4+, Chrome */
	background:-webkit-linear-gradient(top, #ffffff, #cccccc); /* Chrome 10+, Safari 5.1+, iOS 5+ */
	background:  -moz-linear-gradient(top, #ffffff, #cccccc); /* Firefox 3.6-15 */
	background:    -o-linear-gradient(top, #ffffff, #cccccc); /* Opera 11.10-12.00 */
	background:       linear-gradient(to bottom, #ffffff, #cccccc); /* Firefox 16+, IE10, Opera 12.50+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cccccc',GradientType=0 );
	-webkit-border-radius:3px; 
	border-radius:3px;
	font-size: 13px;
	font-weight: 400;
}
.nav li{display:inline}
.nav li:first-child a{border-left:0}
.nav a{display:block;float:left;height:35px;border-left:1px solid #ccc;text-transform:uppercase;color:#444;line-height:35px;text-shadow:1px 1px 0 #eee;padding:0 20px}
.nav a:hover {
	color:#07C; text-shadow:1px 1px 0 #fff; 
	background:#eee;
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#dddddd)); /* Safari 4+, Chrome */
	background:-webkit-linear-gradient(top, #fff, #ddd); /* Chrome 10+, Safari 5.1+, iOS 5+ */
	background:  -moz-linear-gradient(top, #fff, #ddd); /* Firefox 3.6-15 */
	background:    -o-linear-gradient(top, #fff, #ddd); /* Opera 11.10-12.00 */
	background:       linear-gradient(to bottom, #fff, #ddd); /* Firefox 16+, IE10, Opera 12.50+ */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 );
}
.nav li.current a{color:#06A;cursor:default}

/* Hero */
.hero{position:relative;width:1180px;margin:0 auto;padding:0;clear:both;height:435px}
.heroText{position:absolute;z-index:10;right:100px;top:13%;max-width:350px}
.heroText p{font-size:18px;padding:10px 2px}
.heroText img{height:38px}

/* Slider */
.nivoSlider {position:relative;width:1180px;height:auto;overflow:hidden}
.nivoSlider img {position:absolute;top:0;left:0;max-width: none}
.nivo-main-image{display:block!important;position:relative!important;width:100%!important;height:auto}
.nivoSlider a.nivo-imageLink{position:absolute;top:0;left:0;width:100%;height:100%;border:0;z-index:6;display:none;background:#FFF;filter:alpha(opacity=0);opacity:0;margin:0;padding:0}
.nivo-slice{display:block;position:absolute;z-index:5;height:100%;top:0}
.nivo-box{display:block;position:absolute;z-index:5;overflow:hidden}
.nivo-box img{display:block}
.nivo-caption{position:absolute;left:0;bottom:0;background:#000;color:#fff;width:100%;z-index:8;opacity:0.8;overflow:hidden;display:none;-moz-opacity:0.8;filter:alpha(opacity=8);-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:5px 10px}
.nivo-caption p{margin:0;padding:5px}
.nivo-caption a{display:inline!important}
.nivo-html-caption{display:none}
.nivo-directionNav a{display:none;position:absolute;top:45%;z-index:9;cursor:pointer}
.nivo-prevNav{left:0}
.nivo-nextNav{right:0}
.nivo-controlNav{position:absolute;text-align:center;z-index:9;right:700px;margin:5px 0}
.nivo-controlNav a{display:inline-block;width:22px;height:22px;background:url(../images/bullets.png) no-repeat;text-indent:-9999px;border:0;cursor:pointer;margin:0}
.nivo-controlNav a.active{background-position:0 -22px}

/* Download Button */
.downloadBtn{right:100px; margin-top:20px}
.downloadBtn a{display:inline-block;height:105px;width:340px;border:0;cursor:pointer;background:url(../images/downloadBtn.png) no-repeat}
.downloadBtn a:hover{background-position:center -106px}
.downloadBtn a p{position:relative;z-index:11;top:58px;left:156px;text-align:left;font-size:12px}

/* Features */
.talkFeatures{width:980px;min-height:300px;margin:30px auto}
.talkFeatures h1{font-size:19px;font-weight:600}
.talkFeatures p{font-size:14px;font-weight:300;padding:1px 30px}
.imgContainer{height:200px;padding-top:20px}
.imgContainer img{vertical-align:bottom}
.f1,.f2,.f3{width:33%;float:left;text-align:center}

/* Footer */
#footer{width:986px;font-size:12px;margin:auto;padding:0 0 40px; clear:both}
#footer div{width:986px;overflow:hidden;border-top:1px solid #c7c7c7;color:#6c6c6c;padding:10px 0}
#footer div p{float:left}
#footer div ul{float:right}
#footer div ul li{display:inline;color:#6c6c6c;padding:0 5px 0 0}
#footer div ul li a{color:#6c6c6c;padding:0 5px 0 0}
#footer #localeSwitch{float:right;width:auto;border-color:#aaa;border-style:solid;border-width:1px;padding:0}
#footer p{margin-bottom:0;font-size:12px;line-height:14px}