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

Tabion jQuery by SONHLAB.com - version 1.0
Website: http://sonhlab.com
Documentation: http://docs.sonhlab.com/tabion-jquery-responsive-tab-accordion/

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


/*========== START SHADOW LIST ==========*/
.shadow-white,
.shadow-black,
.shadow-blue,
.shadow-green,
.shadow-red,
.shadow-orange {
	text-decoration:none;
}
.shadow-white {
	box-shadow:0px 0px 6px 3px #fff;
	-webkit-box-shadow:0px 0px 6px 3px #fff;
	-moz-box-shadow:0px 0px 6px 3px #fff;
	-o-box-shadow:0px 0px 6px 3px #fff;
	-ms-box-shadow:0px 0px 6px 3px #fff;
}
.shadow-blue {
	box-shadow:0px 0px 6px 3px #38D1F7;
	-webkit-box-shadow:0px 0px 6px 3px #38D1F7;
	-moz-box-shadow:0px 0px 6px 3px #38D1F7;
	-o-box-shadow:0px 0px 6px 3px #38D1F7;
	-ms-box-shadow:0px 0px 6px 3px #38D1F7;
}
.shadow-green {
	box-shadow:0px 0px 6px 3px #AACA37;
	-webkit-box-shadow:0px 0px 6px 3px #AACA37;
	-moz-box-shadow:0px 0px 6px 3px #AACA37;
	-o-box-shadow:0px 0px 6px 3px #AACA37;
	-ms-box-shadow:0px 0px 6px 3px #AACA37;
}
.shadow-red {
	box-shadow:0px 0px 6px 3px #E81750;
	-webkit-box-shadow:0px 0px 6px 3px #E81750;
	-moz-box-shadow:0px 0px 6px 3px #E81750;
	-o-box-shadow:0px 0px 6px 3px #E81750;
	-ms-box-shadow:0px 0px 6px 3px #E81750;
}
.shadow-black {
	box-shadow:0px 0px 6px 3px #444;
	-webkit-box-shadow:0px 0px 6px 3px #444;
	-moz-box-shadow:0px 0px 6px 3px #444;
	-o-box-shadow:0px 0px 6px 3px #444;
	-ms-box-shadow:0px 0px 6px 3px #444;
}
.shadow-orange {
	box-shadow:0px 0px 6px 3px #FF6600;
	-webkit-box-shadow:0px 0px 6px 3px #FF6600;
	-moz-box-shadow:0px 0px 6px 3px #FF6600;
	-o-box-shadow:0px 0px 6px 3px #FF6600;
	-ms-box-shadow:0px 0px 6px 3px #FF6600;
}

/*========== END SHADOW LIST ==========*/


/*========== START HOVER SHADOW LIST ==========*/

.hovershadow-white, .hovershadow-black, .hovershadow-blue, .hovershadow-green, .hovershadow-red, .hovershadow-orange {
	text-decoration:none;
}
.hovershadow-white:hover {
	box-shadow:0px 0px 6px 3px #fff;
	-webkit-box-shadow:0px 0px 6px 3px #fff;
	-moz-box-shadow:0px 0px 6px 3px #fff;
	-o-box-shadow:0px 0px 6px 3px #fff;
	-ms-box-shadow:0px 0px 6px 3px #fff;
}
.hovershadow-blue:hover {
	box-shadow:0px 0px 6px 3px #38D1F7;
	-webkit-box-shadow:0px 0px 6px 3px #38D1F7;
	-moz-box-shadow:0px 0px 6px 3px #38D1F7;
	-o-box-shadow:0px 0px 6px 3px #38D1F7;
	-ms-box-shadow:0px 0px 6px 3px #38D1F7;
}
.hovershadow-green:hover {
	box-shadow:0px 0px 6px 3px #AACA37;
	-webkit-box-shadow:0px 0px 6px 3px #AACA37;
	-moz-box-shadow:0px 0px 6px 3px #AACA37;
	-o-box-shadow:0px 0px 6px 3px #AACA37;
	-ms-box-shadow:0px 0px 6px 3px #AACA37;
}
.hovershadow-red:hover {
	box-shadow:0px 0px 6px 3px #E81750;
	-webkit-box-shadow:0px 0px 6px 3px #E81750;
	-moz-box-shadow:0px 0px 6px 3px #E81750;
	-o-box-shadow:0px 0px 6px 3px #E81750;
	-ms-box-shadow:0px 0px 6px 3px #E81750;
}
.hovershadow-black:hover {
	box-shadow:0px 0px 6px 3px #444;
	-webkit-box-shadow:0px 0px 6px 3px #444;
	-moz-box-shadow:0px 0px 6px 3px #444;
	-o-box-shadow:0px 0px 6px 3px #444;
	-ms-box-shadow:0px 0px 6px 3px #444;
}
.hovershadow-orange:hover {
	box-shadow:0px 0px 6px 3px #FF6600;
	-webkit-box-shadow:0px 0px 6px 3px #FF6600;
	-moz-box-shadow:0px 0px 6px 3px #FF6600;
	-o-box-shadow:0px 0px 6px 3px #FF6600;
	-ms-box-shadow:0px 0px 6px 3px #FF6600;
}

/*========== END HOVER SHADOW LIST ==========*/



/*========== START BACKGROUND LIST ==========*/

/* Solid Colors */
.solid-lightblue { background:#E4F0F7; }
.solid-blue { background:#00BBE2; }
.solid-blue-2 { background:#2C84EE; }
.solid-darkblue { background:#044E94; }
.solid-violetred { background:#781766; }
.solid-red { background:#E51400;}
.solid-red-2 { background:#E81750; }
.solid-pink { background:#FF539B; }
.solid-purple { background:#D02090; }
.solid-orange { background:#FB8F02; }
.solid-orange-2 { background:#FF6600; }
.solid-orange-3 { background:#DD5F37; }
.solid-coral { background:#CD5B45; }
.solid-lightgreen { background:#F5FFFA; }
.solid-green { background:#67B239; }
.solid-green-2 {background:#96BF01; }
.solid-darkgreen { background:#016C38; }
.solid-olive { background:#999900}
.solid-grass { background:#CDCD00; }
.solid-darkred { background:#5F0000; }
.solid-gold { background:#FEE9AE; }
.solid-yellow { background:#F7D100; }
.solid-black { background:#000; }
.solid-smoke { background:#F5F5F5; }
.solid-white { background:#fff; }
.solid-jade { background:#00CE9B; }
/* End Solid Colors */

/* Transparent Colors */
.transparent-dark { background: rgba(25,25,25,0.9); }
.transparent-white { background: rgba(250,250,250,0.9); }
.transparent-deepsea { background: rgba(0,53,100,0.2); }
.transparent-smoke { background: rgba(245,245,245,0.2); }
.transparent-grass { background: rgba(205,250,0,0.2); }
.transparent-black { background: rgba(0,0,0,0.2); }
.transparent-darknight { background: rgba(0,0,0,0.6); }
.transparent-red { background: rgba(255,0,0,0.2); }
.transparent-violetred { background: rgba(208,32,144,0.2); }
.transparent-green { background: rgba(103,178,57,0.2); }
.transparent-yellow { background: rgba(255,255,0,0.2); }
.transparent-orange { background: rgba(251,143,2,0.2); }
.transparent-coral { background: rgba(205,91,69,0.2); }
.transparent-wheat { background: rgba(238,216,174,0.2); }
.transparent-redwine { background: rgba(139,0,0,0.2); }
.transparent-mist { background: rgba(255,255,255,0.6); }
/* End Transparent Colors */

/* Background Images */
.img-wood { background:#FB8F02 url(../images/bg/wood_pattern.jpg) repeat; }
.img-purtywood { background:#FB8F02 url(../images/bg/purty_wood.jpg) repeat; }
.img-woodtexture { background:#FB8F02 url(../images/bg/wood_texture.jpg) repeat; }
.img-darkwood { background:#000 url(../images/bg/dark_wood.jpg) repeat; }
.img-retinawood { background:#FB8F02 url(../images/bg/retina_wood.png) repeat; }
.img-nastyfabric { background:#999 url(../images/bg/nasty_fabric.png) repeat; }
.img-wildoliva { background:#555 url(../images/bg/wild_oliva.png) repeat; }
.img-darkbrick { background:#555 url(../images/bg/dark_brick_wall.png) repeat; }
.img-navyblue { background:#555 url(../images/bg/navy_blue.png) repeat; }
.img-brickwall { background:#ccc url(../images/bg/brickwall.png) repeat; }
/* End Background Images */

/*========== END BACKGROUND LIST ==========*/




/*========== START TABION ==========*/
.tabionjs {
	position:relative;
}

.button-holder {
	display:block;
	width:100%;
	text-align:left;
	position:relative;
	height: 240px;
}
.tabbt {
	display:inline-block;
	margin:0;
}


/*===== Start Vertical Layout =====*/
.verticaltab > .tab-leftside {
	float:left;
}
.verticaltab > .tab-rightside {
	float:right;
}
.verticaltab > .content-holder {
	margin:0 5px;
}
.verticaltab > .tab-smallbar {
	width:90px;
}
.verticaltab > .tab-smallbar > .tabbt,
.verticaltab > .tab-standardbar > .tabbt {
	margin-bottom:5px;
}
.verticaltab > .tab-standardbar {
	width:180px;
}
/*===== End Vertical Layout =====*/


/*===== Start Metro Style =====*/

/* Start Style 1 */
.metrostyle-1 > .tabbt {
	opacity:0.75;
}
.metrostyle-1 > .tab-active {
	opacity:1;
}

.metrostyle-1 > .tabbt:hover {
	opacity:0.90;
}

/* End Style 1 */


/* Start Style 2 */
.metrostyle-2 > .tabbt:hover {
	color:#000;
	background:#E4F0F7;
	opacity:0.8;
}
.metrostyle-2 > .tab-active {
	color:#fff;
	background:#00CE9B;
}
/* End Style 2 */



/* Start Small Tile Style */
.button-smalltile {
	text-align:center;
	cursor:pointer;
	width:20%;
	height:100px;
	font-weight: bold;
}

.button-smalltile > .button-icon {
	height:46px;
	width:46px;
	line-height:1;
	margin:10px auto;
	display:inline-block;
}
.button-smalltile > .button-icon > i {
	font-size:40px;
}
.button-smalltile > .button-icon > img {
	height:100%;
	width:100%;
}
.button-smalltile > .button-title {
	padding-bottom:0px;
	display:block;
	font-size:14px;
	line-height:1;
	display:block;
}
/* End Small Tile Style */


/* Start Standard Tile Style */
.button-standardtile {
	cursor:pointer;
	width:180px;
	height:90px;
}
.button-standardtile > .button-icon {
	line-height:90px;
	height:90px;
	margin:0 0 0 10px;
}
.button-standardtile > .button-icon > i,
.button-standardtile > .button-icon > img {
	font-size:40px;
	width:48px;
	height:48px;
	line-height:1;
	display:inline-block;
	vertical-align: middle;
	margin:0;
}
.button-standardtile > .button-title {
	vertical-align: middle;
	display:inline;
	font-size:16px;
	line-height:1;
}
/* End Standard Tile Style */
/*===== End Metro Style =====*/


.content-holder {
	position:relative;
	margin: 5px 0;
}

.tabcontent {
	padding-top:40px;
	padding-bottom:20px;
	display:none;
	position:relative;
}

.tabcontent > p {
/*	padding:20px 20px 0 20px; */
	font-size:14px;
	line-height:1.5;
}
.tabcontent > .title {
/*	font-size:30px;
	padding:20px 20px 0 20px; */
	margin: 0;
	margin-bottom: 20px;
	text-transform:uppercase;
}


.tab-showcontent {
	display:block;

	-webkit-animation-duration: 1s;
	-webkit-animation-delay: 0.2s;
	-webkit-animation-timing-function: ease;
	-webkit-animation-fill-mode: both;
	-moz-animation-duration: 1s;
	-moz-animation-delay: 0.2s;
	-moz-animation-timing-function: ease;
	-moz-animation-fill-mode: both;
	-ms-animation-duration: 1s;
	-ms-animation-delay: 0.2s;
	-ms-animation-timing-function: ease;
	-ms-animation-fill-mode: both;
	-o-animation-duration: 1s;
	-o-animation-delay: 0.2s;
	-o-animation-timing-function: ease;
	-o-animation-fill-mode: both;
	animation-duration: 1s;
	animation-delay: 0.2s;
	animation-timing-function: ease;
	animation-fill-mode: both;
	
	padding: 40px;
	
	
	
}


/* Start Close Button */
.tab-closebt {
	font-size:20px;
	width:40px;
	height:40px;
	line-height:40px;
	text-align:center;
	cursor:pointer;
	display:block;
	float:left;
	position:relative;
	z-index:9999;
	margin:10px;
}
/* End Close Button */



/* Start Tab Control */
.tab-control {
	margin:10px;
	height:40px;
	float:right;
	position:relative;
	z-index:9999;
}
.tabctrl-prev,
.tabctrl-play,
.tabctrl-next {
	font-size:20px;
	width:40px;
	height:40px;
	line-height:40px;
	text-align:center;
	cursor:pointer;
	display:block;
	float:left;
}
.tabctrl-play {
	margin:0 10px;
}
/* End Tab Control */




/* Start Responsive Tab */
.responsive-tab {
	height:90px;
	position:relative;
	z-index:9999;
	cursor:pointer;
	display:none;
}
.responsive-tab > .resbutton {
	display:block;
	text-align:center;
	line-height:90px;
	height:90px;
	width:90px;
	position:absolute;
	right:0;
}
.responsive-tab > .resbutton > i {
	font-size:40px;
	line-height:90px;
}

/* End Responsive Tab */


/*========== END TABION ==========*/






/*========== START RESPONSIVE ==========*/
@media screen and (min-width:960px) {
	.responsive-tab {
		display:none !important;
	}
	.button-holder {
		position:relative !important;
	}
	.tabbt {
		display:inline-block !important;
	}	
	.tabcontent {
		display:none !important;
	}
	.tab-showcontent {
		display:block !important;
	}	
	.tab-control {
		display:block !important;
	}
	
}

@media screen and (max-width:959px) {

	.responsive-tab {
		display:block;
	}	
	.button-holder {
		position:absolute;
		top:0;
		float:none !important;
		width:100% !important;
	}	
	.tabbt {
		width:100%;
		display:none;
		text-align:left;
	}
	.tabbt > .button-icon {
		line-height:90px;
		height:90px;
		margin:0 10px;
	}
	.button-smalltile > .button-icon > i,
	.button-smalltile > .button-icon > img {
		font-size:40px;
		width:48px !important;
		height:48px !important;
		line-height:1;
		display:inline-block;
		vertical-align: middle;
		margin:0 !important;
	}
	.tabbt > .button-title {
		vertical-align: middle;
		display:inline;
		font-size:18px;
		line-height:1;
	}
	.tab-active {
		display:block !important;
		height: 90px;
	}
	
	.content-holder {
		width:auto !important;
		float:none !important;
		margin:5px 0 !important;
	}
	
	.verticaltab > .tab-leftside {
		float:none !important;
	}
	.verticaltab > .tab-rightside {
		float:none !important;
	}
	
	.verticaltab > .tab-smallbar > .tabbt,
	.verticaltab > .tab-standardbar > .tabbt {
		margin-bottom:0;
	}
	
	.logo {
	width: 100%;
	position: relative;
	float: none;
	margin: 0 auto;
}





/*========== END RESPONSIVE ==========*/


/* MISC */
.clearspace { clear: both; }
.floatleft { float:left !important; }
.floatright { float:right !important; }
.none { display:none !important; }
.light-text { color:#fff; }
.dark-text { color:#1e1e1e; }
.width-680 { width:680px; }
.width-860 { width:860px; }
.width-770 { width:770px; }
