/* ****************************

		Clear Theme

**************************** */

hr {
	margin: 30px 0;
	height: 1px;
	background: #D7D7D7;
	border: none;
	border-bottom: 1px solid #fff;
}

/* Generic Utility */
.hide {
	position: absolute;
	top: -9999px;
	left: -9999px;
}



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

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

.nav li{
	float:left;
	position:relative;
	display:block;
	height:66px;
	line-height:37px;
	text-align:center;
	font-weight:bold;
	color:#72777B;
	font-size:13px;
	background:#fff;
	border:none;
}

/* Align Left */
.nav.left li {width:86px;}
.nav.left li:last-child {margin-right: 0;}


/* Align Center */
.nav.center.col2 {width:172px;}
.nav.center.col3 {width:258px;}
.nav.center.col4 {width:344px;}

.tab-holder { width: 100%; }
.nav.center.col5 { width:100%; }
.nav.center.col5:after { content: ''; display: block; clear: both; }


.nav.center.col6 {width:516px;}
.nav.center.col7 {width:602px;}
.nav.center.col8 {width:688px;}
	
.nav.center.col2 li,
.nav.center.col3 li,
.nav.center.col4 li,
.nav.center.col5 li,
.nav.center.col6 li,
.nav.center.col7 li,
.nav.center.col8 li { box-sizing:border-box; background: url(../images/main-bgd-pattern.png) repeat center center; float:left; width: auto; font-weight:normal; font-size:1.125em; padding:15px 2.5em; font-family: 'Gotham Rounded'; color:#999f84; text-transform:uppercase; border-left:1px solid transparent; border-right:1px solid transparent; border-top:1px solid transparent; }

.nav.center.col5 li span { display: block; position: relative; top:13px; width: 100%; height: 1px; margin-left: -2.5em; padding-left: 2.5em; padding-right: 2.5em; background: url(../images/main-bgd-pattern.png) repeat center center; }


/* right */
.nav.right li {float: right; width:86px;}
.nav.right li:first-child{border-radius: 0 3px 3px 0}
.nav.right li:last-child{border-radius:3px 0 0 3px}


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

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

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

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

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

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

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


.nav li:hover {
	cursor:pointer;
	color:#5f711c !important;
}

.nav li.active{
	z-index:50;
	color:#5f711c !important;
	border-top:1px solid #ccc !important;
	border-left:1px solid #ccc !important;
	border-right:1px solid #ccc !important;
	border-bottom:1px solid transparent !important;
	background: -webkit-linear-gradient(rgba(247, 246, 242, 0.4), rgba(240, 238, 230, 0.1));
  background: -o-linear-gradient(rgba(247, 246, 242, 0.4), rgba(240, 238, 230, 0.1)); 
  background: -moz-linear-gradient(rgba(247, 246, 242, 0.4), rgba(240, 238, 230, 0.1)); 
  background: linear-gradient(rgba(247, 246, 242, 0.4), rgba(240, 238, 230, 0.1));
}
.nav li.active span { position: relative; top:1px; }



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

.content {
    border: none;
    border-top:1px solid #ccc;
    box-sizing: border-box;
    clear: both;
    display: inline-block;
    padding: 0;
    position: relative;
    width: 100%;
}

/* 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%;
}


/* ****************************
			Gallery
**************************** */

.gallery .row-fluid .span2 {
	margin-bottom: 1.25%;
	margin-left: 1.58%;
}

.content .gallery .thumb {
    position: relative;
    width: 100%;
}

.content .gallery .thumb .thumb_hover {
    position: absolute;
    visibility:hidden;
    opacity: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #ccc;
    background: rgba(0,0,0,0.1);
    text-align: center;
    border-radius: 3px;
	-webkit-transition:visibility 0s linear 0.5s,opacity 0.5s linear;
	   -moz-transition:visibility 0s linear 0.5s,opacity 0.5s linear;
		 -o-transition:visibility 0s linear 0.5s,opacity 0.5s linear;
			transition:visibility 0s linear 0.5s,opacity 0.5s linear;
}

.content .gallery .thumb:hover .thumb_hover {
    visibility:visible;
	cursor: pointer;
    opacity:1;
    -webkit-transition-delay:0s;
       -moz-transition-delay:0s;
    	 -o-transition-delay:0s;
    		transition-delay:0s;
}

.content .gallery img {
    width: 100%;
    max-width: 100%;
    height: auto;
	border-radius: 3px;
}


/* ****************************
			To-Do
**************************** */

.content .desc{
	width: 100%;
	background:#ebebeb;
	border:solid 1px #C4C4C4;
	border-top:solid 1px #AFAFAF;
	border-radius:3px;
	box-shadow:inset 0 1px 0 #e6e6e6, 0 1px 0 #fff;
	list-style-type: none;
}

.content .desc li{
	border-bottom:solid 1px #D7D7D7;
	box-shadow:0 1px 0 #F8F8F8;
	padding: 14px 3%;
	line-height: 20px;
	list-style-type: none;
}

.content .desc li span{
	color: #9c9c9c;
	font-size:.7em;
	padding-left:10px;
	text-transform:uppercase
}

.content .desc li:last-child{
	border-bottom:none;
	box-shadow:none;
	list-style-type: none;
}


/* ****************************
			Skills
**************************** */

.content .skills {
	width: 98%;
}

.content .skills li {
	background-color:#eaeaea;
	background:-moz-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eaeaea), color-stop(100%, #e7e7e7));
	background:-webkit-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
	background:-o-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
	background:-ms-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
	background:linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#e7e7e7')";
		filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#e7e7e7');
	text-align:right;
	margin: 10px 0;
	height: 40px;
	line-height: 40px;
	padding-right: 10px;
	border-radius: 0 3px 3px 0;
	-webkit-box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;
	   -moz-box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;
			box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;		
}



/* ****************************
			Team
**************************** */

.content .team .thumb {
	font-family: 'socialicoregular';
	font-size: 200px;
	line-height: 180px;
	text-align: center;
	color: #ebebeb
}

.content .team h4 {
	margin-bottom: 0px;
	text-transform: uppercase;
}

.content .team span {
	color: #9c9c9c;
	font-size:.8em;
	text-transform:uppercase;
}

.content .team a {
	font-family: 'socialicoregular', sans-serif;
	line-height: 42px;
	margin-right: 4px;
	font-size: 42px;
	text-decoration:none;
	-webkit-transition: color 400ms;
	   -moz-transition: color 400ms;
		 -o-transition: color 400ms;
			transition: color 400ms;
}

.content .team a:last-child {
	border-right: none;
	margin-right: 0;
}

.content .team a.facebook:hover {color: #3a5b92;}
.content .team a.twitter:hover {color: #40bdf9;}
.content .team a.plus:hover {color: #c53030;}
.content .team a.dribble:hover {color: #ef578d;}



/* ****************************
			Selection
**************************** */


/* ****************************
			Section
**************************** */


h3.v_nav {display: none;}


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

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

	h3.v_nav {
		display: block;
		cursor: pointer;
		margin: 0;
		padding: 0;
		background-color:#f8f8f8;
		background:-moz-linear-gradient(top, #f8f8f8 0%, #f2f2f2 100%);
		background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #f8f8f8), color-stop(100%, #f2f2f2));
		background:-webkit-linear-gradient(top, #f8f8f8 0%, #f2f2f2 100%);
		background:-o-linear-gradient(top, #f8f8f8 0%, #f2f2f2 100%);
		background:-ms-linear-gradient(top, #f8f8f8 0%, #f2f2f2 100%);
		background:linear-gradient(top, #f8f8f8 0%, #f2f2f2 100%);
		-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='#f2f2f2')";
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f8f8f8', endColorstr='#f2f2f2');
		border:solid 1px #D7D7D7;
		height:37px;
		line-height:37px;
		font-size:13px;
		text-align:center;
		font-weight:bold;
		color:#72777B;
		margin-top: -1px;
		-webkit-box-shadow: 0px 1px 0px #FFF, inset 0 1px 0 #FFF;
		   -moz-box-shadow: 0px 1px 0px #FFF, inset 0 1px 0 #FFF;
				box-shadow: 0px 1px 0px #FFF, inset 0 1px 0 #FFF;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
		 -khtml-user-select: none;
		   -moz-user-select: none;
			-ms-user-select: none;
				user-select: none;
	}

	h3.v_nav:first-child {
		border-radius: 3px 3px 0 0;
		margin-top: 0;
	}

	h3.v_nav.last {
		border-radius: 0 0 3px 3px;
	}

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

	h3.v_active {
		z-index:50;
		background-color:#eaeaea;
		background:-moz-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
		background:-webkit-gradient(linear, left top, left bottom, color-stop(0%, #eaeaea), color-stop(100%, #e7e7e7));
		background:-webkit-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
		background:-o-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
		background:-ms-linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
		background:linear-gradient(top, #eaeaea 0%, #e7e7e7 100%);
		-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#e7e7e7')";
			filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaeaea', endColorstr='#e7e7e7');
		color: #2F373C;
		border:solid 1px #C4C4C4;
		-webkit-box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;
		   -moz-box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;
				box-shadow:inset 0 1px 0 #DEDEDE, 0px 1px 0px #FFF;
	}

	.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%;}


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

	.gallery .row-fluid .span2 {
		width: 23.404255319148934%;
		*width: 23.351063829787233%;
		margin-top: 1%;
		margin-left: 1.4%;
	}

}

@media all and (max-width: 670px) {
.nav.center.col2 li, .nav.center.col3 li, .nav.center.col4 li, .nav.center.col5 li, .nav.center.col6 li, .nav.center.col7 li, .nav.center.col8 li { width: 100%; height: auto; padding: 7px 2.5em; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-top: 1px solid #ccc; }
.nav.center.col5 li:last-child { border-bottom: 1px solid #ccc !important; }
.nav li.active { border-bottom: none !important; background: #FFBD14 !important; }
.tab_content { padding-top: 0; }
.content { border: none; padding: 0; }
}



/* ***********************************
	Font-face for social buttons
*********************************** */

@font-face {
    font-family: 'socialicoregular';
    src: url('../font/socialico-webfont.eot');
    src: url('../font/socialico-webfont.eot?#iefix') format('embedded-opentype'),
         url('../font/socialico-webfont.woff') format('woff'),
         url('../font/socialico-webfont.ttf') format('truetype'),
         url('../font/socialico-webfont.svg#socialicoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@media all and (max-width: 500px) {
	.content { padding:0.5em; }


/* ****************************
	 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; }
}