/*
Theme Name: 	Graphene
Theme URI: 		http://www.graphene-theme.com/
Description: 	We believe that every theme should facilitate creative writing, not hinder it. We also believe that each site should have the opportunity to be unique. Since the theme's inception, we have received countless suggestions and requests on features that really matter. We listened, and we delivered. Here's a theme that's packed full of features that you need, yet far from being overwhelming. Here's a theme that's easy to use for beginners, yet well documented and powerful enough to be endlessly customisable to users with even only moderate technical skills. Here's a theme that's available in more than  30 languages and is backed with active community support, where questions, ideas and suggestions are always welcomed. And best of all, here's a theme that's completely free. Here's a theme that's yours to make it special. PS: Mobile-optimised option is available.
Version: 		1.9.4.3
Author: 		Syahir Hakim
Author URI: 	http://www.khairul-syahir.com/
Tags: 			one-column, two-columns, three-columns, right-sidebar, left-sidebar, custom-colors, custom-header, custom-background, custom-menu, editor-style, theme-options, threaded-comments, sticky-post, translation-ready, rtl-language-support, post-formats, featured-image-header, featured-images, full-width-template, microformats
Text Domain: 	Graphene
License: 		GNU General Public License, Version 3 (or newer)
License URI: 	http://www.gnu.org/licenses/gpl.html
*/


/* =Icon font
-------------------------------------------------------------- */

@font-face {
	font-family: 'Genericons';
	src: url('fonts/genericons/genericons-regular-webfont.eot');
	src: url('fonts/genericons/genericons-regular-webfont.eot?#iefix') format('embedded-opentype'),
	     url('fonts/genericons/genericons-regular-webfont.woff') format('woff'),
	     url('fonts/genericons/genericons-regular-webfont.ttf') format('truetype'),
	     url('fonts/genericons/genericons-regular-webfont.svg#genericonsregular') format('svg');
	font-weight: normal;
	font-style: normal;
}


/* =Resets and Clearfix
-------------------------------------------------------------- */

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
img,
ul,
ol,
li,
form,
fieldset {
	border: 0 none;
	margin: 0;
	padding: 0;
}


/* Containers
----------------------------------------------------------------------------------------------------*/
.container_16 {
    margin-left: auto;
    margin-right: auto;
    width: 960px;
}


/* Generic classes
----------------------------------------------------------------------------------------------------*/

.display-block {
	display: block;
}
.hide {
	display: none;
}


/* Grid >> Global
----------------------------------------------------------------------------------------------------*/
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16 {
    display: inline;
    float: left;
    position: relative;
    margin-left: 10px;
    margin-right: 10px;
}
.push_1,
.pull_1,
.push_2,
.pull_2,
.push_3,
.pull_3,
.push_4,
.pull_4,
.push_5,
.pull_5,
.push_6,
.pull_6,
.push_7,
.pull_7,
.push_8,
.pull_8,
.push_9,
.pull_9,
.push_10,
.pull_10,
.push_11,
.pull_11,
.push_12,
.pull_12,
.push_13,
.pull_13,
.push_14,
.pull_14,
.push_15,
.pull_15,
.push_16,
.pull_16 {
    position: relative
}
.gutter-left {
	margin-left: 10px;
}
.gutter-right {
	margin-right: 10px;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/
.alpha {
    margin-left: 0
}
.omega {
    margin-right: 0
}
/* Grid >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .grid_1 {
    width: 40px
}
.container_16 .grid_2 {
    width: 100px
}
.container_16 .grid_3 {
    width: 160px
}
.container_16 .grid_4 {
    width: 220px
}
.container_16 .grid_5 {
    width: 280px
}
.container_16 .grid_6 {
    width: 340px
}
.container_16 .grid_7 {
    width: 400px
}
.container_16 .grid_8 {
    width: 460px
}
.container_16 .grid_9 {
    width: 520px
}
.container_16 .grid_10 {
    width: 580px
}
.container_16 .grid_11 {
    width: 640px
}
.container_16 .grid_12 {
    width: 700px
}
.container_16 .grid_13 {
    width: 760px
}
.container_16 .grid_14 {
    width: 820px
}
.container_16 .grid_15 {
    width: 880px
}
.container_16 .grid_16 {
    width: 940px
}
/* Prefix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .prefix_1 {
    padding-left: 60px
}
.container_16 .prefix_2 {
    padding-left: 120px
}
.container_16 .prefix_3 {
    padding-left: 180px
}
.container_16 .prefix_4 {
    padding-left: 240px
}
.container_16 .prefix_5 {
    padding-left: 300px
}
.container_16 .prefix_6 {
    padding-left: 360px
}
.container_16 .prefix_7 {
    padding-left: 420px
}
.container_16 .prefix_8 {
    padding-left: 480px
}
.container_16 .prefix_9 {
    padding-left: 540px
}
.container_16 .prefix_10 {
    padding-left: 600px
}
.container_16 .prefix_11 {
    padding-left: 660px
}
.container_16 .prefix_12 {
    padding-left: 720px
}
.container_16 .prefix_13 {
    padding-left: 780px
}
.container_16 .prefix_14 {
    padding-left: 840px
}
.container_16 .prefix_15 {
    padding-left: 900px
}
/* Suffix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .suffix_1 {
    padding-right: 60px
}
.container_16 .suffix_2 {
    padding-right: 120px
}
.container_16 .suffix_3 {
    padding-right: 180px
}
.container_16 .suffix_4 {
    padding-right: 240px
}
.container_16 .suffix_5 {
    padding-right: 300px
}
.container_16 .suffix_6 {
    padding-right: 360px
}
.container_16 .suffix_7 {
    padding-right: 420px
}
.container_16 .suffix_8 {
    padding-right: 480px
}
.container_16 .suffix_9 {
    padding-right: 540px
}
.container_16 .suffix_10 {
    padding-right: 600px
}
.container_16 .suffix_11 {
    padding-right: 660px
}
.container_16 .suffix_12 {
    padding-right: 720px
}
.container_16 .suffix_13 {
    padding-right: 780px
}
.container_16 .suffix_14 {
    padding-right: 840px
}
.container_16 .suffix_15 {
    padding-right: 900px
}
/* Push Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .push_1 {
    left: 60px
}
.container_16 .push_2 {
    left: 120px
}
.container_16 .push_3 {
    left: 180px
}
.container_16 .push_4 {
    left: 240px
}
.container_16 .push_5 {
    left: 300px
}
.container_16 .push_6 {
    left: 360px
}
.container_16 .push_7 {
    left: 420px
}
.container_16 .push_8 {
    left: 480px
}
.container_16 .push_9 {
    left: 540px
}
.container_16 .push_10 {
    left: 600px
}
.container_16 .push_11 {
    left: 660px
}
.container_16 .push_12 {
    left: 720px
}
.container_16 .push_13 {
    left: 780px
}
.container_16 .push_14 {
    left: 840px
}
.container_16 .push_15 {
    left: 900px
}
/* Pull Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/
.container_16 .pull_1 {
    left: -60px
}
.container_16 .pull_2 {
    left: -120px
}
.container_16 .pull_3 {
    left: -180px
}
.container_16 .pull_4 {
    left: -240px
}
.container_16 .pull_5 {
    left: -300px
}
.container_16 .pull_6 {
    left: -360px
}
.container_16 .pull_7 {
    left: -420px
}
.container_16 .pull_8 {
    left: -480px
}
.container_16 .pull_9 {
    left: -540px
}
.container_16 .pull_10 {
    left: -600px
}
.container_16 .pull_11 {
    left: -660px
}
.container_16 .pull_12 {
    left: -720px
}
.container_16 .pull_13 {
    left: -780px
}
.container_16 .pull_14 {
    left: -840px
}
.container_16 .pull_15 {
    left: -900px
}
/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
.clearfix:before,
.clearfix:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}
.clearfix:after {
    clear: both
}
/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/
.clearfix {
    zoom: 1
}


/* =Non-classed HTML elements
-------------------------------------------------------------- */

body {
	background: url(images/bg_g.png) repeat #000 fixed;
	color: #2c2b2b;
	font: normal 12px arial;
	line-height: 18px;
	position: relative;
}
a {
	color: #1772af;
	text-decoration: none;
}
a:hover {
	color: #074d7c;
	text-decoration: none;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
textarea {
	border: 1px solid #e3e3e3;
	color: #555;
	font: normal 12px arial;
	padding: 6px 3px;
	height: 16px;
}



/* =Container elements
-------------------------------------------------------------- */

.bg-gradient {
	background: url(images/bg-gradient.png) left bottom repeat-x fixed;
	position: relative;
	width: 100%;
	height: 100%;
	padding-bottom: 1px;
}
#container {
	-webkit-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
}


/* =Header
-------------------------------------------------------------- */

#top-bar {
	background: url(images/sprite_h.png) left -596px repeat-x #313130;
	border-bottom:1px solid #222;
	height: 54px;
	position: relative;
	z-index: 10;
}
#profiles{
	padding-top: 13px;
	float: left;
}
#profiles a {
	float: left;
	margin-right: 10px;
}
#profiles span {
	display: none;
}
#top_search {
	float: right;
	margin-top: 15px;
}
#top_search input {
	box-shadow: inset 0 0 3px #333;
	border: none;
	color: gray;
	padding: 3px 7px 2px 5px;
	width: 79.5455%;
	height: 18px;
	float: left;
}
#top_search button {
	background: url(images/sprite_master.png) -38px top no-repeat;
	border: 0;
	cursor: pointer;
	display: block;
	float: right;
	width: 23px;
	height: 23px;
}
#top_search button span {
	display: none;
}
#nav #top_search {
	position: absolute;
	right: 0;
	top: 50%;
	margin-top: -12px;
}
#header {
	border-top: 1px solid #000;
	height: 198px;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.header-img {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: -480px;
}
#header .header_title {
	font: normal 32px "Pontano Sans", arial, sans-serif;
	letter-spacing: -1px;
	position: absolute;
	bottom: 30%;
}
.header_title,
.header_title a,
.header_title a:hover {
	text-decoration: none;
	color: #000;
}
.header_desc {
	font-size: 18px;
	font-weight: normal;
	border-bottom: none;
	color: #000;
	position: relative;
	top: 68%;
	width: 852px;
	font: normal 22px "Pontano Sans", arial, sans-serif;
}
#header_img_link {
	display: block;
	position: absolute;
	text-decoration: none;
	width: 100%;
	height: 198px;
}
#header .sidebar-wrap {
	position: absolute;
	z-index: 50;
}
.sidebar-wrap #searchsubmit {
	float: right;
	margin-top: 10px;
}
.sidebar-wrap #s {
	width: 160px;
}


/* =Navigation
------