/* 
	Template Name: Clean Rounded
	Template URI: www.slidetabs.com
	Description: Clean style tabs
	Author: SlideTabs
	Author URI:
*/

/* NOTE: Prefix the template styles with <TEMPLATE FOLDER NAME>-horizontal/vertical */


/* 
 * Horizontal Tabs
 *
------------------------------------------------------------------------------------- */
div.clean_rounded-horizontal { /* The main container */
	position:relative;
	clear:both;
	width:100%; /* Set the full width */
}

/* Directional Buttons (horizontal)
------------------------------------------------------------------------------------- */
div.clean_rounded-horizontal > div.st_tabs a.st_prev, 
div.clean_rounded-horizontal > div.st_tabs a.st_next { /* Directional buttons (previous/next) */
	display:none;
	position:absolute;
	top:-55px;
	z-index:110;
	height:34px;
	width:43px;
	text-indent:-999em;
	outline:none;
	background: url("../img/arrows_h.gif") no-repeat;
}
div.clean_rounded-horizontal > div.st_tabs a.st_prev { /* Previous button */
	right: 30px;
	background-position:center 4px;
}
div.clean_rounded-horizontal > div.st_tabs a.st_prev:hover { /* Previous button hover */	
	background-position:center -57px;
}
div.clean_rounded-horizontal > div.st_tabs a.st_next { /* Next button */
	right:-10px;
	background-position:center -27px;
}
div.clean_rounded-horizontal > div.st_tabs a.st_next:hover { /* Next button hover */	
	background-position:center -87px;
}
div.clean_rounded-horizontal > div.st_tabs a.st_prev.st_btn_disabled, 
div.clean_rounded-horizontal > div.st_tabs a.st_next.st_btn_disabled { /* Previous and next buttons disabled state */
	cursor:default;
}
div.clean_rounded-horizontal > div.st_tabs a.st_prev.st_btn_disabled { /* Previous button disabled state */
	background-position:center -117px;
}
div.clean_rounded-horizontal > div.st_tabs a.st_next.st_btn_disabled { /* Next button disabled state */
	background-position:center -148px;
}

/* Tabs (horizontal)
------------------------------------------------------------------------------------- */
div.clean_rounded-horizontal > div.st_tabs { /* Tabs main container */
	position:relative;
	z-index:100;		
	width:100% !important;	
	height:142px;
	margin-bottom:-1px;
	overflow:hidden;
}
div.clean_rounded-horizontal.st_sliding_active > div.st_tabs { /* Tabs main container - sliding active (the '.st_sliding_active' class is added to the tabs main container when the tabs are 'slidable') */
	overflow:visible;
}
div.clean_rounded-horizontal > div.st_tabs div.st_tabs_wrap { /* Tabs slide-container */
	position:relative !important; /* Don't remove: The tabs sliding position will be calculated from the tabs <ul> first parent element with position:relative */
	width:100%;
}
div.clean_rounded-horizontal.st_sliding_active > div.st_tabs div.st_tabs_wrap { /* The '.st_sliding_active' class is added to the main container when tab sliding is activated */
	width:auto !important;
	margin:0px 0px; /* Adds side margins to make space for the arrow buttons */
}
div.clean_rounded-horizontal > div.st_tabs ul { /* Tabs unordered list */
	width:10000px; /* Set to an arbitrary high value */
	margin:0px;
	padding:0px;
	list-style:none;
}
div.clean_rounded-horizontal > div.st_tabs ul li { /* Tab list elements */
	display:block;
	float:left;
	margin:0px;
	margin-right: 19px;
}
div.clean_rounded-horizontal > div.st_tabs ul li a { /* Tab links */
	display:block;
	height:161px;
	margin:0px;
	font-size:12px;
	line-height:43px;
	font-weight:bold;
	color:#6a6a6a;
	text-decoration:none;
	outline:none;
}
div.clean_rounded-horizontal > div.st_tabs ul li a:hover { /* Tabs hover state */
	color:#333;
}
div.clean_rounded-horizontal > div.st_tabs ul li a.st_tab_first { /* First tab element */


}
div.clean_rounded-horizontal.st_sliding_active > div.st_tabs ul li a.st_tab_first { /* First tab element (with tab sliding activated) */
	border-left:0 none;
	border-top-left-radius:0px; /* Reset top-left border radius */
}
div.clean_rounded-horizontal > div.st_tabs ul li a.st_tab_last { /* Last tab element */
}
div.clean_rounded-horizontal.st_sliding_active > div.st_tabs ul li a.st_tab_last { /* Last tab element (with tab sliding activated) */
	border-right:0 none;
	border-top-right-radius:0px;
}
div.clean_rounded-horizontal > div.st_tabs ul li a.st_tab_active { /* Tab active/highlighted state */
	padding-bottom:2px;
	color:#1ca5ec;
}

/* Content (horizontal)
------------------------------------------------------------------------------------- */
div.clean_rounded-horizontal > div.st_views { /* Main content container */
	position:relative;
	min-height:775px;
	padding:0px !important; /* No padding on this container */
	line-height:19px;
	overflow:hidden;
}
div.clean_rounded-horizontal.st_sliding_active > div.st_views {
	border-top-right-radius:0px; /* Remove top-right border radius when tab sliding is enabled */
}
div.clean_rounded-horizontal > div.st_views div.st_view { /* Content containers */
	z-index:5;
	width:100%;
	height:100%;
	overflow:hidden;
	background-image:none;
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; /* Set 'border-box' box-sizing when using 100% width/height combined with margin or padding */
	/* Background-image attributes */
	background-repeat:no-repeat !important;
	background-position:center center !important;
	background-color:transparent !important;
	-webkit-font-smoothing:antialiased; /* Safari text rendering fix */
}
div.clean_rounded-horizontal > div.st_views div.st_view_inner { /* Inner content containers */
	padding:0px; /* Padding for the content */
}
div.clean_rounded-horizontal > div.st_views div.st_view_first { /* First content container */
	display:block; /* Show the first content container */
}

/* 
 * Media Queries
 *
------------------------------------------------------------------------------------- */
@media screen and (max-width: 760px) {
	/* Horizontal Tabs
	------------------------------------------------------------------------------------- */
	
	/* Tabs (horizontal) */
	div.clean_rounded-horizontal > div.st_tabs ul li a {
		padding-right:21px;
		padding-left:21px;
	}
}

@media screen and (max-width: 480px) {
	/* Tabs (horizontal) */
	div.clean_rounded-horizontal > div.st_tabs ul li a {	
		padding-right:14px;
		padding-left:14px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_next:hover {
		background-position: center 0px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_next {
		right: -53px;
		background-position: center 3px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_prev, div.clean_rounded-horizontal > div.st_tabs a.st_next {
		top: 52px;
		height: 47px;
		width: 43px;
		background: url("../img/mobile-arrows.gif") no-repeat;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_next.st_btn_disabled {
		background-position: center 0px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_prev {
		left: -53px;
		background-position: center -47px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_prev:hover {
		background-position: center -47px;
	}
	
	div.clean_rounded-horizontal > div.st_tabs a.st_prev.st_btn_disabled {
		background-position: center -47px;
	}
}






ul.st_tabs_ul li img {
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	filter: gray;
	-webkit-transition: all .9s ease;
}

li.st_li_active a.st_tab.st_tab_active img {
	filter: grayscale(0%);
	-webkit-filter: grayscale(0%);
	filter: none;
	-webkit-transition: all .9s ease;
}

li.st_li_active a.st_tab.st_tab_active{
	background: url("../img/topics-triangle.png") no-repeat bottom center;
}
