/* ****************************
		Navigation tab
**************************** */

.navtabs {
	position: relative;
	width:100%;
	margin: 0 auto;
}

ul.navtabs li {
	float:left;
	position:relative;
	display:block;
	background: #dbe6eb;
	height:45px;
	line-height: 45px;
	text-align:center;
	font-size: 14px;
	margin-right: 2px;
	padding: 1px 10px;
	border: 1px solid #DBE6EB;
	border-bottom: none;
	-webkit-border-radius: 3px 3px 0px 0px;
	border-radius: 3px 3px 0px 0px;
	z-index:50;
	font-family: 'Soho W01 Regular';
	color: #333;
}
.navtabs li:last-child{
	margin-right: 0px;
}
.navtabs li:before{
	display: none;
}

/* Align Left */
.navtabs.left li {/*width:86px;*/} 


/* Align Center */
.navtabs.center.col2 {width:172px;}
.navtabs.center.col3 {width:258px;}
.navtabs.center.col4 {width:344px;}
.navtabs.center.col5 {width:430px;}
.navtabs.center.col6 {width:516px;}
.navtabs.center.col7 {width:602px;}
.navtabs.center.col8 {width:688px;}
	
.navtabs.center.col2 li,
.navtabs.center.col3 li,
.navtabs.center.col4 li,
.navtabs.center.col5 li,
.navtabs.center.col6 li,
.navtabs.center.col7 li,
.navtabs.center.col8 li {width: 86px;}


/* right */
.navtabs.right li {float: right; width:86px;}


/* fullwidth */
.navtabs.col2 li {
	width:50%;
	*width: 49.9%;
}

.navtabs.col3 li {
	width:33.3333%;
	*width:33.2222%;
}

.navtabs.col4 li {
	width:25%;
	*width:24.9%;
}

.navtabs.col5 li {
	width:20%;
	*width:19.9%;
}

.navtabs.col6 li {
	width:16.6666%;
	*width:16.5555%;
}

.navtabs.col7 li {
	width:14.2857%;
	*width:14.1857%;
}

.navtabs.col8 li {
	width:12.5%;
	*width:12.44%;
}


.navtabs li:hover {
	text-decoration:underline;
	cursor:pointer;
}

.navtabs li.active {
	background: #F4F8FA;
	border: 1px solid #DBE6EB;
	border-bottom: none;
	-webkit-border-radius: 3px 3px 0px 0px;
	border-radius: 3px 3px 0px 0px;
	z-index:50;
	color: #006EAA;
	
}



/* ****************************
			Content
**************************** */

.cleanTabContent {
	clear:both;
	position:relative;
	width: 100%;
	background: #F4F8FA;
	border: 1px solid #DBE6EB;
	-webkit-border-radius: 0px 3px 3px 3px;
	border-radius: 0px 3px 3px 3px;
	top: -1px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}

.clean_tab_content {
	padding: 15px 2% 20px 2%;
}


/* Responsive Row (extracted from bootstrap for a simple integration) */

.row-fluid {
  width: 100%;
  *zoom: 1;
}

.row-fluid:before,
.row-fluid:after {
  display: table;
  line-height: 0;
  content: "";
}

.row-fluid:after {
  clear: both;
}

.row-fluid [class*="span"] {
  display: block;
  float: left;
  width: 100%;
  min-height: 30px;
  margin-left: 2.127659574468085%;
  *margin-left: 2.074468085106383%;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

.row-fluid [class*="span"]:first-child {
  margin-left: 0;
}

.row-fluid .controls-row [class*="span"] + [class*="span"] {
  margin-left: 2.127659574468085%;
}

.row-fluid .span12 {
  width: 100%;
  *width: 99.94680851063829%;
}

.row-fluid .span11 {
  width: 91.48936170212765%;
  *width: 91.43617021276594%;
}

.row-fluid .span10 {
  width: 82.97872340425532%;
  *width: 82.92553191489361%;
}

.row-fluid .span9 {
  width: 74.46808510638297%;
  *width: 74.41489361702126%;
}

.row-fluid .span8 {
  width: 65.95744680851064%;
  *width: 65.90425531914893%;
}

.row-fluid .span7 {
  width: 57.44680851063829%;
  *width: 57.39361702127659%;
}

.row-fluid .span6 {
  width: 48.93617021276595%;
  *width: 48.88297872340425%;
}

.row-fluid .span5 {
  width: 40.42553191489362%;
  *width: 40.37234042553192%;
}

.row-fluid .span4 {
  width: 31.914893617021278%;
  *width: 31.861702127659576%;
}

.row-fluid .span3 {
  width: 23.404255319148934%;
  *width: 23.351063829787233%;
}

.row-fluid .span2 {
  width: 14.893617021276595%;
  *width: 14.840425531914894%;
}

.row-fluid .span1 {
  width: 6.382978723404255%;
  *width: 6.329787234042553%;
}


h3.v_navtabs {display: none;}



/* ****************************
		  Media query
**************************** */

@media all and (max-width: 768px) {

	.navtabs {display: none;}

	h3.v_navtabs {
		height:45px;
		line-height:45px;
		font-size:13px;
		margin: 0;
		padding: 0;
		background: #dbe6eb;
		text-align:center;
		margin-top: 1px;
		display: block;
		cursor: pointer;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		 -khtml-user-select: none;
		   -moz-user-select: none;
			-ms-user-select: none;
				user-select: none;
		color: #333;		
	}
	
	.cleanTabContent {
		-webkit-border-radius: 3px 3px 3px 3px;
		border-radius: 3px 3px 3px 3px;
	}

	h3.v_navtabs:first-child {
		margin-top: 0;
	}

	h3.v_navtabs:hover {
		text-decoration:underline;
	}

	h3.v_active {
		background: #F4F8FA;
		border: none;
		border-bottom: none;
		-webkit-border-radius: 3px 3px 0px 0px;
		border-radius: 3px 3px 0px 0px;
		z-index:50;
		color: #006EAA;
	}

	.row-fluid [class*="span"] {margin-left: 0; margin: 1% 0;}

	.row-fluid .span1, 
	.row-fluid .span2, 
	.row-fluid .span3, 
	.row-fluid .span4, 
	.row-fluid .span5, 
	.row-fluid .span6, 
	.row-fluid .span7, 
	.row-fluid .span8, 
	.row-fluid .span9, 
	.row-fluid .span10, 
	.row-fluid .span11, 
	.row-fluid .span12 {width: 100%;}

}



/* ****************************
	IE10 split screen fix
**************************** */

@media screen and (max-width: 320px) {
	@-ms-viewport { width: 320px; }
}
 
@media screen and (min-width: 768px) and (max-width: 959px) {
	@-ms-viewport { width: 768px; }
}
