/* ================================================================================================ */
/* ================================================================================================ */
/* ================ Main CSS Document to Style the entire website ================================= */
/* ================================================================================================ */
/* ================================================================================================ */


*
{
	padding: 0px;
	margin: 0px;
	border: none;
	text-decoration: none;
}

h1, h2, h3, h4
{
	font-weight: normal;
	font-size: 20px;
	color: #333333;
}

body
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #555555;
	margin: 20px;

	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;

  overflow: hidden;
}

.clear
{
	clear: both;
	line-height: 0px;
}

.hidden, .none
{
	display: none;
}

a
{
	color: #333333;
}

a:hover
{
	color: #66ff00;
}

p
{
	padding-bottom: 20px;
	line-height: 1.5em;
}

img
{
	border: none;
}

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

#header
{
	position: relative;
	height: 40px;
}

#header a#logo
{
	display: block;
	max-width: 400px;
	height: 30px;
}

/*
	Social Links in the header
================================
*/

.social-links
{
	list-style-type: none;
	position: absolute;
	top: 25px;
	right: 20px;
}

.social-links li
{
	float: left;
	margin-right: 5px;
}

.social-links li a
{
}

.social-links li a:hover
{
	zoom: 1;
	filter: alpha(opacity=50);
	opacity: 0.5;
}

/* ================================================================================================ */
/* ================================================================================================ */
/* ============================== Mobile Menu as SELECT =========================================== */
/* ================================================================================================ */
/* ================================================================================================ */

.mobile-menu
{
	display: none;
}

/* Please refer to small.css for the styling */

/* ================================================================================================ */
/* ================================================================================================ */
/* ============================== Sidebar and Navigation ========================================== */
/* ================================================================================================ */
/* ================================================================================================ */

#sidebar
{
	width: 150px;
}

#sidebar nav ul li ul
{
	/*
	this will disable the layout glitch on page load. As we will show the menu
	using javascript. Please refer to the main.js file and you will find the code
	at the very bottom. 'showSlideshow()'
    */
	/*-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;*/

	display: none;
}

ul.navigation, ul.navigation ul
{
	list-style-type: none;
	padding: 0;
	margin: 0;
}

ul.navigation li a
{
	color: #888;
	display: block;
	padding: .5em 0;
	font-size: .85em;
	text-transform: uppercase;
}

ul.navigation a:hover, ul.navigation li.current a
{
	color: #111;
}

ul.navigation li ul li a
{
	padding-left: 1em;
	font-size: .8em;
	color: #888;
}

ul.navigation li ul li a:hover, ul.navigation li ul li.current a,
ul.navigation li.current-menu-item a,
ul.navigation li.current-menu-parent > a


{
	color: #111;
}


/* ================================================================================================ */
/* ================================================================================================ */
/* ==============================  Cotent and Pages  ============================================== */
/* ================================================================================================ */
/* ================================================================================================ */

#page
{
	width: 1000px; 			/* modified using javascript */
	height: 600px;			/* modified using javascript */
	left: 300px;			/* modified using javascript */
	top: 100px;				/* modified using javascript */
	position: absolute;		/*background-color: #f00;*/
}


/* ================================================================================================ */
/* ================================================================================================ */
/* ================================= Text Pages =================================================== */
/* ================================================================================================ */
/* ================================================================================================ */

#text_page
{
	width: 710px;
	height: 400px;
	margin: 0 auto;
	font-size: 12px;
	position: relative;
	top: 45%;
	margin-top: -200px;/* half of #content height*/
	overflow: hidden;
}

#text_page h1
{
	height: 40px;
	padding-top: 10px;
	color: #333333;
	font-weight: normal;
	font-size: 20px;
}

#text_scroll
{
	width: 710px;
	height: 350px;
}

.news_item
{
	padding-bottom: 15px;
}

h2.news_heading
{
	color: #141414;
	padding: 5px 8px;
	font-weight: normal;
	font-size: 14px;
	background-color: #E1E1E1;
	margin-bottom: 20px;
}

.news_body
{
	width: 680px;
	color: #737373;
}

.news_body table td
{
	padding-bottom: 5px;
}

.news_body td ul
{
	list-style-type: none;
}

.news_body .row
{
	padding-bottom: 3px;
}

.news_body .left
{
	float: left;
	width: 190px;
	font-weight: bold;
}

.news_body .right
{
	float: left;
	width: 480px;
}


/* ================================================================================================ */
/* ================================================================================================ */
/* ================================= Slideshow ======================================================= */
/* ================================================================================================ */
/* ================================================================================================ */

#slideshow
{
	/*background-color: green;*/
	/*
	this will disable the layout glitch on page load. As we will show the slideshow
	using javascript. Please refer to the main.js file and you will find the code
	at the very bottom. 'showSlideshow()'
    */
	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
}

.rslides
{
	position: relative;
	list-style: none;
	overflow: hidden;
	width: 100%;
	/*height: 200px;*/
	overflow: hidden;
	padding: 0;
	margin: 0;
}

.rslides li
{
	-webkit-backface-visibility: hidden;
	position: absolute;
	display: none;
	width: 100%;
	left: 0;
	top: 0;
}

.rslides li:first-child
{
	position: relative;
	display: block;
	float: left;
}

.rslides img
{
	display: block;
	height: auto;
	float: left;
	/*width: 100%;*/
	border: 0;
}

.rslides img.slide-photo
{
	float: none;
	width: auto;
	height: auto;
	/*max-height: 200px;*/ /* <= set max-height here */
	margin: 0 auto; /* auto left/right margin for centering */
}


/* ================================================================================================ */
/* ================================================================================================ */
/* ======================= Gallery with scrollbar ================================================= */
/* ================================================================================================ */
/* ================================================================================================ */

#preloading
{
	position: absolute;
	display: none;
}

#gallery
{
	overflow: auto;
	/*
	this will disable the layout glitch on page load. As we will show the gallery
	using javascript. Please refer to the main.js file and you will find the code
	at the very bottom. 'showGallery()'
    */
	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
}

#gallery ul
{
	list-style: none;
	display: block;
	padding: 0;
	margin: 0;
	width: 200000px; 	/* will be modified via jQuery on window load *//*background-color: #00f;*/
}

#gallery ul li
{
	padding: 0;
	margin: 0;
	float: left;
	display: block;
	position: relative;
}

#gallery ul li img
{
	height: 600px;
	max-width: none;	/* stupid ie8 */
	display: block;
	float: left;
	margin-right: 15px;
}

#gallery ul li:last-child img
{
	margin-right: 0px;
}

#gallery ul li span
{
	position: absolute;
	bottom: 0px;
	left: 0px;

	font-size: .9em;
	display: block;
	width: 0px; /* modifed from js */
	padding: 5px 0; /* modifed from js */
	background: rgba(0, 0, 0, .1);
	color: #fff;
	text-shadow: 1px 1px 5px #000000;
	display: none; /* we will show it using javascript */
}


/* ================================================================================================ */
/* ================================================================================================ */
/* =============================== Gallery with Thumbnails ======================================== */
/* ================================================================================================ */
/* ================================================================================================ */


#gallery_thumbs
{
	position: relative;
	/*overflow: hidden;*/
	/*
	this will disable the layout glitch on page load. As we will show the gallery
	using javascript. Please refer to the main.js file and you will find the code
	at the very bottom. 'showGallery()'
    */

	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
}


#gallery_thumbs #image-caption
{
	display: none; /* we will show it using javascript */
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	font-size: .8em;
	text-align: center;
	margin-top: -20px; /* modifed from js */
	color: #000;

	/* modified from main.js */
	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;

	color: #999;
}

#gallery_thumbs a.previous-link,
#gallery_thumbs a.next-link
{
	display: block;

	/* modified from main.js */
	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;


	position: absolute;
	width: 50%;
	height: 500px; /* modified from main.js */

	background-position-y: center;
	background-repeat: no-repeat;

	outline: none;
}

#gallery_thumbs a.previous-link
{
	top: 0px;
	left: 0px;
	background-image: url(../img/btn-left.png);
	background-position-x: left;
}

#gallery_thumbs a.next-link
{
	top: 0px;
	right: 0px;
	background-image: url(../img/btn-right.png);
	background-position-x: right;
}

#gallery_collection
{
	display: none;
}

#gallery_image
{
	/*background-color: #eef;*/
	position: relative; /* for span */
}

#gallery_image img
{

	display: block;
	float: none;
	width: auto;
	height: auto;
	/*max-height: 200px;*/ /* <= set max-height here */
	margin: 0 auto; /* auto left/right margin for centering */
}



#thumbs
{
	/*background-color: blue;*/
	position: absolute;
	overflow: hidden;
	left: 0px;
	bottom: 0px;
}

/*
Thumbnail scroller jQuery plugin
scrollers styling
*/
.jThumbnailScroller
{
	position: relative;
	width: 800px; /* modified automaticaly */
	height: 75px; /* make sure to add space for border top & bottom,if there is any */
	margin: 0px auto 0 auto;
	/*border: 1px solid #eee;*/
	/*background: #bbb;*/
	padding: 0;/*overflow: hidden;*/
}

.jThumbnailScroller .jTscrollerContainer
{
	position: absolute;/*width: 10000px;*/
}

.jThumbnailScroller .jTscroller
{
	position: relative;
	height: 100%;
	margin: 0;
	left: 0;
	top: 0;
	display: inline-block;
 	*display:inline;
}

.jThumbnailScroller .jTscrollerNextButton, .jThumbnailScroller .jTscrollerPrevButton
{
	position: absolute;
	display: block;
	width: 40px;
	height: 40px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
	opacity: 0.7;
}

.jThumbnailScroller .jTscrollerNextButton
{
	background: #000 url(../img/nextArrow.png) center center;
}

.jThumbnailScroller .jTscrollerPrevButton
{
	background: #000 url(../img/prevArrow.png) center center;
}

.jThumbnailScroller .jTscrollerNextButton:hover, .jThumbnailScroller .jTscrollerPrevButton:hover
{
	background-color: #d56916;
	opacity: 1;
}

.jThumbnailScroller .jTscroller a
{
	display: block;
	float: left;
	margin: 0 5px 0 0;
	/*background: #fff;*/

	-moz-opacity: 0.45;
	zoom: 1;
	filter: alpha(opacity=45);
	opacity: 0.45;
}

.jThumbnailScroller .jTscroller a:hover, .jThumbnailScroller .jTscroller a.active
{
	-moz-opacity: 1;
	zoom: 1;
	filter: alpha(opacity=100);
	opacity: 1;
}

.jThumbnailScroller .jTscroller a:first-child
{
/*margin-left: 10px;*/
}

.jThumbnailScroller .jTscroller a img
{
	border: none;
	display: block;
	float: left;
	height: 75px;
	max-width: none;	/* stupid ie8 */
}

/* different styled scrollers */
/* liquid width scroller */
.jThumbnailScroller#thumbs
{
/* controlled by 'js/main.js' */
	/*width: 100%;*/
}

/* ================================================================================================ */
/* ================================================================================================ */
/* =================== Scrollbars used on the gallery and pther text pages ======================== */
/* ================================================================================================ */
/* ================================================================================================ */

/* == malihu jquery custom scrollbars plugin == version: 2.1
   author: malihu (http://manos.malihu.gr)
   plugin home: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/* basic scrollbar styling */
/* vertical scrollbar */

.mCSB_container
{
	width: auto;
	margin-right: 20px;
	overflow: hidden;
}

.mCSB_container.mCS_no_scrollbar
{
	margin-right: 0;
}

.mCustomScrollBox .mCSB_scrollTools
{
	width: 16px;
	height: 100%;
	top: 0;
	right: 0;
}

.mCSB_scrollTools .mCSB_draggerContainer
{
	height: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.mCSB_scrollTools .mCSB_buttonUp+.mCSB_draggerContainer
{
	padding-bottom: 40px;
}

.mCSB_scrollTools .mCSB_draggerRail
{
	width: 8px;
	height: 100%;
	margin: 0 auto;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.mCSB_scrollTools .mCSB_dragger
{
	cursor: pointer;
	width: 100%;
	height: 30px;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar
{
	width: 8px;
	height: 100%;
	margin: 0 auto;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	text-align: center;
}

.mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown
{
	height: 20px;
	overflow: hidden;
	margin: 0 auto;
	cursor: pointer;
}

.mCSB_scrollTools .mCSB_buttonDown
{
	bottom: 0;
	margin-top: -40px;
}

/* horizontal scrollbar */
.mCSB_horizontal .mCSB_container
{
	height: auto;
	margin-right: 0;
	margin-bottom: 30px;
	overflow: hidden;
}

.mCSB_horizontal .mCSB_container.mCS_no_scrollbar
{
	margin-bottom: 0;
}

.mCSB_horizontal.mCustomScrollBox .mCSB_scrollTools
{
	width: 100%;
	height: 16px;
	top: auto;
	right: auto;
	bottom: 0;
	left: 0;
	overflow: hidden;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_draggerContainer
{
	height: 100%;
	width: auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonLeft+.mCSB_draggerContainer
{
	padding-bottom: 0;
	padding-right: 20px;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_draggerRail
{
	width: 100%;
	height: 8px;
	margin: 6px 0;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_dragger
{
	width: 30px;
	height: 100%;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar
{
	width: 100%;
	height: 8px;
	margin: 6px auto;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_horizontal .mCSB_scrollTools .mCSB_buttonRight
{
	width: 20px;
	height: 100%;
	overflow: hidden;
	margin: 0 auto;
	cursor: pointer;
	float: left;
}

.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonRight
{
	right: 0;
	bottom: auto;
	margin-left: -40px;
	margin-top: -16px;
	float: right;
}

/* default scrollbar colors and backgrounds */
.mCustomScrollBox .mCSB_scrollTools
{
	opacity: 1;
}

.mCustomScrollBox:hover .mCSB_scrollTools
{
	opacity: 1;
}

.mCSB_scrollTools .mCSB_draggerRail
{
	background: #DADADA;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar
{
	background: #000000;
}

.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar
{
	background: #000000;
}

.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar
{
	background: #000000;
}

.mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight
{
}

.mCSB_scrollTools .mCSB_buttonUp
{
	background-position: 0 0;
}

.mCSB_scrollTools .mCSB_buttonDown
{
	background-position: 0 -20px;
}

.mCSB_scrollTools .mCSB_buttonLeft
{
	background-position: 0 -40px;
}

.mCSB_scrollTools .mCSB_buttonRight
{
	background-position: 0 -56px;
}

.mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover
{
}

.mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active
{
}

/* ================================================================================================ */
/* ================================================================================================ */
/* ================================= Footer ======================================================= */
/* ================================================================================================ */
/* ================================================================================================ */


#footer
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 40px;
}

#footer .footer_text
{
	position: absolute;
	width: 100%;
	bottom: 15px;
	left: 25px;
	font-size: .9em;
}

#footer .link
{
	margin: 0 1em;
}

#footer .copyright
{
	position: absolute;
	left: 0px;
	bottom: 0px;
}


#footer .email
{
	position: absolute;
	right: 45px;
	bottom: 0px;
	font-size: .85em;
}

/* ============================================== */

.chabbu-link{
	z-index: 1000000;
	font-style: normal;
}



/**
 * *****************************************************************************
 * Video Gallery
 * *****************************************************************************
 */

#text_page.video-page{
	width: 890px; /*710*/
	height: 420px;
}

.video-player-box
{
	float: left;
	position: relative;
}

.video-player-box h2
{
	font-size: 14px;
	padding: 0;
	margin: 0;
	color: #810000;
	margin: 8px 0 9px 0;
}

.video-player-box .download.downlod-video
{
	position: absolute;
	right: 5px;
	top: 6px;
	display: none;
}

.video-player
{
	width: 535px;
	height: 380px;
	background: #000000;
}


.video-thumbs-sidebar
{
	width: 345px; /* 337px; without scrollbar */
	height: 380px;


	float: right;
	/* =============================== */
	-moz-opacity: 0;
	zoom: 1;
	filter: alpha(opacity=0);
	opacity: 0;
	/* =============================== */

}

#video-thumbs-collection
{
	width: 100%;
	height: 380px;


}

#video_category
{
	width: 98.2%;
	padding: 2px 1%;
	background-color: #E6E6E6;
	border: 1px solid #B37373;
	color: #810000;
	outline: none;
	margin-bottom: 8px;
}

a.video-thumb
{
	display: block;
}
.video-thumb
{
	background-image: url(../img/video-thumb-line.png);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 6px 0 5px 5px;
}

a.video-thumb:hover,
.video-thumb.video-thumb-active
{
	background-repeat: repeat-y;
}
.video-thumb-image
{
	width: 65px;
	float: left;
}

.video-thumb-image img
{
	width: 62px;
	height: 52px;
	float: left;
}

.video-thumb-right
{
	width: 250px;
	float: right;
}

.video-thumb-title
{
	color: #810000;
}

.video-thumb-description
{
	color: #737373;
}