/*  

Theme Name: EHVFXD
Theme URI: http://ehvfxd.net/
Description: Rounded fixed WordPress theme
Version: 2.0
Author: Chinkone
Author URI: http://khanh.nl/
Tags: dark, rounded, grid, minimal, clean

*/

html {
	margin: 0;
	padding: 0;
	font-size: 62.5%;
	overflow-x: hidden;
	overflow-y: scroll;
}

body {
	background-color: #292929;
	color: #666;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	line-height: 1.4em;
}

h1, h2, h3 {
	text-transform: capitalize;	
	}

h1, h2, h3, ul, p {
	padding: 0px;
	margin-top: 3px;
	margin-right: 0px;
	margin-bottom: 3px;
	margin-left: 0px;
}

a {
	color: #666;
	text-decoration: none;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #666;
}

a:hover {
	color: #00c4b9;
	text-decoration: none;
}

img {
	border: none;
	text-decoration: none;
}

blockquote {
	padding-left: 35px;
	font-style: italic;
	margin-top: 15px;
	margin-right: 30px;
	margin-bottom: 5;
	margin-left: 10px;
	background-image: url(gfx/quotes.png);
	background-repeat: no-repeat;
	background-position: -6px -1px;
	text-align: justify;
	color: #343434;
	}

blockquote cite {
	margin: 5px 0 0;
	display: block;
	}
	
#container, #footer {
	margin-right: auto;
	margin-left: auto;
	width: 926px;
	}
	
#header {
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	width: 926px;
	}
	
#footer {
	margin-top: 50px;
	margin-bottom: 20px;
	margin-right: auto;
	margin-left: auto;
	width: 926px;
	text-align: center;
	}

#footer p {
	font-size: 85%;
	text-transform: uppercase;
	color: #131313;
	}
	
#logo {
	background-image: url(gfx/header_ehvfxd_logo.png);
	background-repeat: no-repeat;
	width: 442px;
	height: 50px;
	float: left;
	cursor: pointer;
	}
	
#logo:hover {
	background-image: url(gfx/header_ehvfxd_logo_jap.png);
	background-repeat: no-repeat;
	width: 442px;
	height: 50px;
	float: left;
	cursor: pointer;
	}
	
#headerMenu {
	background-image: url(gfx/header_bg.png);
	background-repeat: no-repeat;
	width: 440px;
	height: 50px;
	padding-right: 22px;
	padding-left: 20px;
	float: left;
	font-size: 12px;
	font-weight: bold;
	}

#headerMenu ul {
	margin-top: 15px;
	}
	
#headerMenu ul li {
	float: left;
	list-style-type: none;
	margin-right: 20px;
	}

#headerMenu ul li a {
	color: #666;
	text-decoration: none;
	border: none;
	}
	
#headerMenu ul li a:hover {
	color: #00c4b9;
	text-decoration: none;
	border: none;
	}
	
#navSearch {
	position: relative;
	margin-top: 0px;
	left: 115px;
}
#navSearch #Search {
	background-image: url(gfx/search-box-bg.png);
	background-repeat: no-repeat;
	height: 17px;
	width: 174px;
	background-color: transparent;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-family: Helvetica, Arial, sans-serif;
	color: #666666;
	padding-top: 4px;
	padding-left: 6px;
	margin: 0px;
	padding-right: 0px;
	outline: none; 
}

#navSearch #submit {
	position: absolute;
	right: 5px;
	top: 4px;
	margin: 0px !important;
	padding: 0px;
	border: 0px;
}

#headerCarousel {
	float: left;
	width: 684px;
	margin-top: 1px;
	position: relative;
	}
	
.topXLarge {
	background-image: url(gfx/corners_carousel_t.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 682px;
	}
	
.bottomXLarge {
	background-image: url(gfx/corners_carousel_b.png);
	background-repeat: no-repeat;
	height: 28px;
	width: 682px;
	}

.contentXLarge {
	background-color: #121212;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;
	width: 642px;
	height: 200px;
	}

#logo, #blog {
	float: left;
	width: 442px;
	}
	
.blogItem, .pageItem {
	margin-top: 1px;
	}

.topMedium {
	background-image: url(gfx/corners_m_top.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 442px;
	}
	
.bottomMedium {
	background-image: url(gfx/corners_m_bottom.png);
	background-repeat: no-repeat;
	height: 28px;
	width: 442px;
	}

.contentMedium {
	background-color: #121212;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	width: 400px;
	}

.contentMedium h3, .contentMedium h3 a, .contentLarge h3, .contentMedium h2, .contentMedium h2 a, .contentLarge h2 {
	color: #00c4b9;
	text-decoration: none;
	margin-top: 0px;
	border: none;
	}

.contentMedium h3 a:hover{
	color: #666;
	text-decoration: none;
	}

.contentMedium p, .contentLarge p {
	margin-top: 10px;
	margin-bottom: 10px;
	}

.contentMedium p img {
	display: none;
	}
	
.videoWrapper {
	width: 242px;
	float: left;
	margin-top: 1px;
	position: relative;
	}

.videoColumn {
	}

.videoColumnLink {
	margin-top: 1px;
	}

.videoColumn div p a {
	text-transform: uppercase;
	font-size: 70%;
	color: #00c4b9;
	border: none;
	}

	
#blogLabel {
	background-image: url(gfx/label_blog.png);
	background-repeat: no-repeat;
	height: 138px;
	width: 32px;
	margin-bottom: -138px;
	z-index: 4;
	margin-left: -12px;
	position: relative;
	background-position: left 1px;
	}
	
#videoLabel {
	background-image: url(gfx/label_video.png);
	background-repeat: no-repeat;
	height: 107px;
	width: 32px;
	margin-bottom: -107px;
	z-index: 200;
	margin-left: -12px;
	overflow: visible;
	position: relative;
	}

#recommendLabel {
	background-image: url(gfx/label_recommend.png);
	background-repeat: no-repeat;
	height: 112px;
	width: 32px;
	margin-bottom: -112px;
	z-index: 200;
	margin-left: -12px;
	overflow: visible;
	position: relative;
	}

.videoColumn p {
	padding-top: 5px;
	padding-bottom: 10px;
	}

.columnSmall {
	float: left;
	margin-top: 1px;
	position: relative;

	}

.topSmall {
	background-image: url(gfx/corners_s_top.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 242px;
	}
	
.contentSmall {
	background-color: #121212;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 0px;
	padding-left: 20px;
	width: 200px;
	}
	
.contentSmall object, .contentSmall embed {
	background-color: #121212;
	width: 200px;
	height: 140px;
	margin: 0px;
	}
	
.contentSmall p {
	margin-top: 0px;
	margin-bottom: 0px;
	}
	
.bottomSmall {
	background-image: url(gfx/corners_s_bottom.png);
	background-repeat: no-repeat;
	height: 28px;
	width: 242px;
	}
	
.thumbnail, .thumbnail a {
	outline: none;
	margin-bottom: 8px;
	border: none;
}

.thumbnail embed {
	width: 400px;
	height: 280px;
	margin-bottom: 8px;
}

.moreLink {
	text-align: right;
	width: 400px;
	margin-top: 0px;
	margin-bottom: 20px;
}

.moreLink p {
	float: right;
	margin-left: 2px;
}

.balloon {
	background-image: url(gfx/icons-chat-grey.gif);
	background-repeat: no-repeat;
	height: 14px;
	width: 15px;
	float: right;
	}

#tagg {
	background-image: url(gfx/tagg.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 20px;
	margin-left: 231px;
	margin-top: 0px;
	position: relative;
	z-index: 99;
	}
	
.moreTag a {
	height: 17px;
	width: 70px;
	background-color: #000;
	text-align: center;
	border: none;
	margin: 0px;
	outline: none;
	-moz-border-radius:3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius:3px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 10px;	
}

.sidebar {
	float: left;
	position: relative;
	left: 0px;
	top: -249px;
	}
	
.column {
	margin-top: 1px;
	}
	
.column h3 {
	margin-top: 0px;
	}
	
.column ul {
	list-style-type: none;
	margin: 0px;
	}

.column ul img {
	width: 200px;
	}

#navigation {
	width: 200px;
	overflow: auto;
	
}

.voicePoint {
	background-color:transparent;
	background-image:url(gfx/voice-point-dark.png);
	position: relative;
	left: 20px;
	height: 13px;
	width: 17px;
}

.carouselContainer {
	position: relative;
	height: 200px;
}

.carousel li {
	width: 642px;
	height: 200px;
	overflow: hidden;
	position: relative;
	list-style-type: none;
	background-color: #000;
}

#eventsCarousel .carousel {
	width: 642px !important;
	height: 200px !important;
}
/*
#eventsCarousel .mid {
	margin-top: -250px;
	background-image: url(gfx/bg-dark-85.png);
	position:absolute;
	width: 205px;
	height: 250px;
	z-index: 2;
}
*/

#eventsCarousel .over {
	top: -198px;
	margin-bottom: -200px;
	position: relative;
	height: 200px;
	width: 642px;
	z-index: 3;
}
#eventsCarousel .over li {
	background-color: transparent;
	list-style-type: none;	
}
#eventsCarousel .over .infoOverlay {
	height: 20px;
	width: 622px;
	padding: 10px;
	text-align: right;
}

.infoOverlay p {
	margin-top: -8px;
	font-size: 0.8em;
	line-height: 1.9em;
}

/**
 *  Horizontal Buttons
 */
.next {
    position: absolute;
    top: 80px;
    right: -5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(gfx/icons-arrow-right.png) no-repeat 0 0;
	z-index:99;
	border: none;
}

.next:hover {
    background-position: -32px 0;
}

.next:active {
    background-position: -64px 0;
  	outline: none;
}

.prev {
    position: absolute;
    top: 80px;
    left: -5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(gfx/icons-arrow-left.png) no-repeat 0 0;
	z-index:99;
	border: none;
}

.prev:hover {
    background-position: -32px 0;
}

.prev:active {
    background-position: -64px 0;
  	outline: none;
}

/**
 *  END Horizontal Buttons
 */
 
 #voiceBox li {
	list-style: none;
	background-color:#232323;
	padding: 10px;
	margin: 0px;
	position:relative;
}
#voiceBox li.odd {
	background-color:#000;
	text-align: right;
}

#pageLeft {
	float: left;
	width: 442px;
	clear: right;
	}

#pageRight {
	float: left;
	width: 482px;
	}

.topLarge {
	background-image: url(gfx/corners_l_top.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 482px;
	}
	
.bottomLarge {
	background-image: url(gfx/corners_l_bottom.png);
	background-repeat: no-repeat;
	height: 28px;
	width: 482px;
	}

.contentLarge {
	background-color: #121212;
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	width: 442px;
	}
	
.contentLarge object, .contentLarge embed {
	margin-bottom: 5px;
	width: 440px;
	}
	
.iconKhanh {
	float: left;
	background-image: url(gfx/icons-site-credits.png);
	background-repeat: no-repeat;
	height: 30px;
	width: 30px;
	margin-right: 10px;
	background-position: -30px 0px;
	}
	
.iconKhanh:hover {
	background-image: url(gfx/icons-site-credits.png);
	height: 30px;
	width: 30px;
	background-position: 0px 0px;
	}
	
.iconUp {
	background-image: url(gfx/btn-back-up.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 75px;
	background-position: 0px 0px;
	border: none;
	margin-right: auto;
	margin-left: auto;
	margin-top: 15px;
	margin-bottom: 50px;
}

.iconUp:hover {
	background-image: url(gfx/btn-back-up.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 75px;
	background-position: -75px 0px;
	border: none;
	margin-right: auto;
	margin-left: auto;
	margin-top: 15px;
	margin-bottom: 50px;
}

#iconRSS {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 50px;
	background-position: 0px 0px;
	border: none;
}

#iconRSS:hover {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 50px;
	background-position: -75px 0px;
	border: none;
}

#iconFlickr {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 65px;
	background-position: 0px -20px;
	border: none;
}

#iconFlickr:hover {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 65px;
	background-position: -75px -20px;
	border: none;
}

#iconTwitter {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 75px;
	background-position: 0px -40px;
	border: none;
}

#iconTwitter:hover {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 75px;
	background-position: -75px -40px;
	border: none;
}

#iconVimeo {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 65px;
	background-position: 0px -60px;
	border: none;
}

#iconVimeo:hover {
	background-image: url(gfx/icons-external.png);
	background-repeat: no-repeat;
	height: 20px;
	width: 65px;
	background-position: -75px -60px;
	border: none;
}

#exLinksWrapper {
	overflow: auto;
	margin-bottom: -8px;
}

.exLinks {
	float: right;
	margin-left: 2px;
	margin-bottom: 2px;
}
	
.related {
	list-style: none;	
	clear: both;
	display: block;
	text-align: left;
	overflow: hidden;
}

.related a {
	margin: 0px;
	padding: 0px;
	height: 80px;
	overflow: hidden;
	float: left;
	border: none;
}	
.related img, .related object, .related embed {
	width: 98px;
	margin-right: 2px;
	min-height: 70px;
	border: none;
}

/************ COMMENTS ************/

.commentlist {
	list-style: none;
	padding: 0px;
	width: 400px;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;	
}
.commentlistEach li {
 	padding: 10px;
 	margin: 0px;
 	background-color: #fff;
 	width: 260px;
	color:#222;
	overflow: hidden;
	float: right;
	margin-bottom: 20px;
	display:block;
}

.commentlistEach li img {
 	width: 290px;
}

.commentlist li.authorcomment {
	background:#00de0e;
	color:#fff;
}

.commentlist cite {
	display:block;
	float: right;
	font-style: normal;
	text-align: right;
	width: 120px;
	padding-right: 0px;
	background-image: url(gfx/comment-point-white-left.png);
	background-position:  left 10px;
	background-repeat: no-repeat;
}
.commentlist cite.authorcomment {
	background-image: url(gfx/comment-point.png);
}

#respond {
	margin-top: 40px;	
}
#zrx_captcha table {
	margin-top: 4px;	
}

.speech {
	background-image:url(gfx/voice-point-light-alt.png);
	display: block;
	width: 17px;
	height: 13px;
	margin-top: -10px;
	margin-left: 20px;
	margin-bottom: 30px;
	position: relative;
	z-index: 200;
}

#commentCode {
	display: none;
	position: absolute;
	right: -25pt;
	bottom: 200px;
	width: 170px;
	padding-top: 10px;
	padding-right: 15px;
	padding-bottom: 10px;
	padding-left: 15px;
	background-image: url(gfx/bg-00c4b9-75.png);
	background-repeat: repeat;
	color: #ffffff;
	font-size: 12px;
	line-height: 16px;
	-moz-border-radius:3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius:3px;
}

#commentCode .arrow {
	height: 0;
	line-height: 0;
	width: 0;
	border-left: 15px solid #444;
	border-left: 15px solid rgba(0,0,0,.8);
	border-bottom: 15px solid transparent;
	position: absolute;
	bottom: -15px;
	right: 20px;
	}

input:focus, input:active, textarea:focus, textarea:active {
	background-color: #ffffff;
	background-image: none;
	background-repeat: repeat;
	background-attachment: scroll;
	background-position: 0% 0%;
	color: #222222;
}
	
textarea {
	width: 380px;
	padding: 10px;
}
.submit {
	background-color: #00c4b9;
	font-weight: bold;
	color: #fff;
	border: 0px;
	margin-top: 10px;
	text-align: center;
	width: 120px;
	height: 20px;
	display: block;

    /* Do rounding (native in Firefox and Safari, CC in IE)  */
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    CCborderRadius: 3px;
	

}
	
#blog .submit {
	background-image: url(gfx/submit-bg-dark.png);
}
.submit:hover {
	color: #222;
	cursor: pointer;
}

#commentsWrapper {
	position: relative;
}

#commentsWrapper input {

}

#commentform p {
	text-align: left;
}

#commentform  label {
	display: none;
}

#contactForm label {
	display: block;
	clear: both;
	margin-bottom: 4px;
	margin-top: 10px;
}

#contactForm .textBox {
	height: 17px;
	width: 250px;
	background-color: #eee;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	font-family: Helvetica, Arial, sans-serif;
	color: #333;
	padding-top: 4px;
	padding-left: 6px;
	margin: 0px;
	padding-right: 0px;
	outline: none;
	-moz-border-radius:3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius:3px;
}

fieldset {
	margin: 0px;
	padding: 0px;	
}

#resources {
	width: 200px;
	margin-top: 0px;
	height: 700px;
}	
#resources .tabContent {
	height: 700px;
	background-color:#FFF;
}	
#resources .tabContent a {
	font-size: 1.2em;
}

.linkList .linkcat h2 {
	display:block;
	color: #00c4b9;
	margin-bottom: 10px;
	padding-bottom: 0px;
}
.linkList ul {
	margin-bottom: 10px;
	margin-top: 0px;
}

.linkList ul a {
	border: none;
}

ul.linkList {
	margin-bottom: 50px;
}

#love ul.linkList {
	height: 537px;
	width: 184px;
	overflow: auto;
	padding-bottom: 100px;

}

#shops ul.linkList {
	height: 537px;
	width: 184px;
	overflow: auto;
	padding-bottom: 100px;

}

#source ul.linkList {
	height: 537px;
	width: 184px;
	overflow: auto;
	padding-bottom: 100px;

}

 /*************** OTHER OVVERIDES ********************/


.jScrollPaneDrag {
	background-color: #00c4b9 !important;
}
 
 
 /*************** TABS ********************/
 
 /* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */

.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
    float: left;
    margin: 0;
	margin-right: 2px;
	background-color:#000000;
	padding: 5px;
	padding-left: 9px;
	padding-right: 9px;
	font-size: 1.4em;
}
.ui-tabs-nav li a {
	color:#FFFFFF;
	border: none;
}
.ui-tabs-nav li.ui-tabs-selected {
    color: #000;
    background-color: #FFF;
}
.ui-tabs-nav li.ui-tabs-selected a {
    color: #00c4b9;
    background-color: #FFF;
	outline: none;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-deselectable a:hover, .ui-tabs-nav .ui-tabs-deselectable a:focus, .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-panel {
    padding: 8px;
    background: #FFF; /* declare background color for container to avoid distorted fonts in IE while fading */
    color: #00c4b9;
	font-size: 0.9em;
	color:#333333;
	height: 434px;
	position: relative;
}
.ui-tabs-panel li {
	list-style: none;
	margin-bottom:4px;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}


/* =----------------------------------- floats + clearing rule */
.floatleft,
.alignleft {
	float: left;
	margin: 3px 7px 0 0;
}
.floatright,
.alignright {
	float: right;
	margin: 3px 0 0 7px;
}
.right {
	float:right;
}
.left {
	float: left;
}
.clear {
	clear: both;
}

.fix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

* html .fix{
	height: 1%;
}
.fix{
	display:
	block;
}

/* FGC */

.col {
	float:left;
	width: 200px;
	margin-top: 0px;
	padding-right: 10px;
	padding-left: 10px;
}

#contentLarge div#col1{
	margin: 1em 0;
}

#contentLarge div#col1 p.form-tips{
	line-height: 12px;
}

#contentLarge div#col1 p.form-elements{
	margin:0;
	line-height: 30px;
	vertical-align:text-top;
}

#contentLarge div#col1{
	padding-left: 0;
	width: 440px;
	clear: both;
}

#main-col select.multiple{
	width: 200px;
	height: 130px;
	border: 1px solid #000;
}

#main-col {
	display: block;

}

#main-col label{
	line-height: 10px;
}

#gear-chart{
	width: 100%;
	clear:both;
}

#gear-calc-form button{
	background-color: #00c4b9;
	font-weight: bold;
	color: #fff;
	border: 0px;
	margin-top: 10px;
	text-align: center;
	width: 120px;
	height: 20px;
	display: block;

    /* Do rounding (native in Firefox and Safari, CC in IE)  */
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    CCborderRadius: 3px;
}

#gear-calc-form button:hover{
	color: #222;
	cursor: pointer;

}

#gear-calc-form button span{
	color: #9cf;
}

#gear-chart tr td{
	background-color: #343434;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #121212;
}

#gear-chart tr.even td{
	background-color: #232323;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #121212;
}

#gear-chart td,
#gear-chart th{
	text-align: center;
	padding: 8px 0;
	font-weight: bold;
}
		