/*

* Skeleton V1.2

* Copyright 2011, Dave Gamache

* www.getskeleton.com

* Free to use under the MIT license.

* http://www.opensource.org/licenses/mit-license.php

* 6/20/2012

*/



/* Table of Content

==================================================

	#Basic Styles

	#Page Styles

	#Media Queries

	#Font-Face */

	



/* #Basic Styles

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

	





h1, h3, h4, h5, h6 {

	font-family: HelveticaNeue, 'Helvetica Neue', Helvetica, Arial, sans-serif;

	font-weight: bold;

	color: #444;

}



h1 { font-size: 30px; line-height: 35px; margin-bottom: 21px; }

h3 { font-size: 18px; line-height: 21px; margin-bottom: 14px; text-transform: uppercase; letter-spacing: 0.02em; }

h4 { font-size: 14px; line-height: 18px; margin-bottom: 7px; text-transform: uppercase; letter-spacing: 0.02em; }



a, a:visited { color: #444; text-decoration: underline; outline: 0; -webkit-transition: color .1s; -moz-transition: color .1s; -o-transition: color .1s; transition: color .1s; }

a:hover, a:focus { color: #999; }

p a, p a:visited { line-height: inherit; }



p { margin: 0 0 21px 0; }





/* buttons */



.button,

button,

input[type="submit"],

input[type="reset"],

input[type="button"] {

	margin: 0 0 14px;

	padding: 7px 13px;

	border: none;

	-webkit-border-radius: 5px;

	border-radius: 5px;

	background: #87c801;

	color: #fff!important;

	font-size: 13px;

	line-height: 21px;

	text-shadow: -1px 0 0 rgba(0,0,0,0.2);

	-webkit-transition: background .1s;

	-moz-transition: background .1s;

	-o-transition: background .1s;

	transition: background .1s;

}



.button:hover,

button:hover,

input[type="submit"]:hover,

input[type="reset"]:hover,

input[type="button"]:hover {

	border: none;

	background: #87c801;

}



.button:active,

button:active,

input[type="submit"]:active,

input[type="reset"]:active,

input[type="button"]:active {

	border: none;

	background: #f2504e;

}





/* #Site Styles

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



.spacer { 

	height: 56px;

	width: 100%;

	clear: both;

}



/* main header */



.main-header { margin: 49px 0 21px; text-align: center; }

.main-header h1 {

	display: inline-block;

	margin: 0;

	padding: 0 10px 21px; 

	background: url(http://linusventures.com/images/heading_stripe.png) repeat-x left bottom; 

}



/* purchase button */



.purchase {

	padding-top: 48px;

}



.purchase em {

	display: block;

	font-size: 12px;

	line-height: 1.3em;

	color: #999999;

}



.button-purchase {

	text-decoration: none!important;

	padding: 14px 18px;

	font-size: 13px;

	line-height: 14px;

	box-shadow: inset 0 -3px 0 0 rgba(0,0,0,0.2);

}



/* theme preview */



.preview-theme {

	margin: 21px 0;

	border: 5px solid #eee;

	background: #fff url(http://linusventures.com/images/preview.png) no-repeat center;

	min-height: 200px;

}



.preview-theme:hover {

	border: 5px solid #e5e5e5;

}



.preview-theme img {

	width: 100%;

	height: auto;

	vertical-align: top;

}



/* nav links */



.nav-links {

	margin-bottom: 2px;

}



.nav-links:before {

	content: '';

	display: block;

	width: 10px;

	height: 0;

	border-top: 1px solid #ccc;

	margin-bottom: 10px;

}



.nav-links a {

	font-weight: bold;

	text-decoration: none;

	color: #555;

}



.nav-links a:hover {

	color: #ff5452;

}



/* portfolio filters */



.portfolio .filters {

	float: right;

	margin: -35px 20px 20px 0; 

}



.portfolio .filters a {

	display: inline-block;

	margin-left: 20px;

	padding: 3px 2px;

	color: #999;

	text-decoration: none;

}



.portfolio .filters a:hover {

	color: #666;

}



.portfolio .filters a.filter-active {

	color: #666;

	border-bottom: 1px solid #47dfff;

}



/* portfolio list */



.portfolio .list {

	clear: both;

}



.portfolio .list li {

	float: left;

	margin: 0 20px 10px 0;

	height:252px;

}



.portfolio .list .thumb {

	position: relative;

	width: 215px;

	height: 134px;

	margin-bottom: 14px;

	overflow: hidden;

}



.portfolio .list .thumb img {

	max-width: 100%;

	height: auto;

	vertical-align: top;

}



.portfolio .list .view {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	box-sizing: border-box;

	background: #fff;

	background: rgba(255,255,255,0.8);

	border: 1px solid #fff;

	text-align: center;

	line-height: 0;

	opacity: 0;

	visibility: hidden;

	-webkit-transition: opacity 0.3s, visibility 0s linear .3s;

	-moz-transition: opacity 0.3s, visibility 0s linear .3s;

	-o-transition: opacity 0.3s, visibility 0s linear .3s;

	transition: opacity 0.3s, visibility 0s linear .3s;

	-webkit-transform: translate3d(0,0,0);

}



.portfolio .list .thumb:hover .view {

	visibility: visible;

	opacity: 1;

	-webkit-transition-delay: 0s;

	-moz-transition-delay: 0s;

	-o-transition-delay: 0s;

	transition-delay: 0s;

}



.portfolio .list .view .button { 

	position: relative;

	top: 50%;

	margin-top: -17px;

}



.portfolio .list h4 {

	text-align: center;	

}



.portfolio .list h4 a {

	text-decoration: none;

}



.portfolio .colio-active-item h4 a {

	background: #ccc;

	padding: 2px 10px;

    line-height: 25px;

}



.portfolio .list p {

	text-align: center;

	font-size: 12px;

	line-height: 1.3em;

}



/* footer */



footer {

	margin-bottom: 21px;

}



footer .copyright {

	font-family: Arial, sans-serif;

	font-size: 12px;

	line-height: 1em;

	color: #999;

}



/* scroll up */



#scrollUp {

	position: fixed;

	bottom: 5px;

	right: 10px;

	width: 42px;

	height: 42px;

	background: #eee url(http://linusventures.com/images/scrollup.png) no-repeat center;

	font: 0/0 a;

	text-shadow: none;

	color: transparent;

	-webkit-border-radius: 3px;

	border-radius: 3px;

}



#scrollUp:hover {

	background-color: #e5e5e5;

}





/* #Page Styles

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



/* #Media Queries

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



	/* Smaller than standard 960 (devices and browsers) */

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



	/* Tablet Portrait size to standard 960 (devices and browsers) */

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

		.colio { margin-right: 24px!important; }

		.portfolio .list .thumb { width: 228px; height: 143px; }

	}



	/* All Mobile Sizes (devices and browser) */

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

		h1, h2, h3, h4, h5, h6 { text-align: center; }

		.preview-theme + p { margin-bottom: 42px; }

		.main-header { margin: 21px 0 0!important; }

		.purchase { text-align: center; padding-top: 21px; }

		.portfolio .filters { float: left; margin-top: 0; text-align: center; width: 100%; }

		.portfolio .filters a { margin: 0 10px; }

		.portfolio .list li { float: none; margin-right: 0; height: auto;}

		.colio { margin-right: 0!important; }

		.portfolio .list .thumb { width: 420px; height: 260px; margin: auto;}

		footer { text-align: center; margin-bottom: 14px!important; }

		.portfolio .list h4 {    text-align: center; margin: auto;   margin-top: 30px;}

	}



	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */

	@media only screen and (min-width: 480px) and (max-width: 767px) {

	}



	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

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

		.portfolio .list .thumb { width: 300px; height: 187px; margin: auto; }
		.portfolio .list h4 { text-align: center;    margin: auto; margin-top: 30px;}

	}





/* #Font-Face

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

/* 	This is the proper syntax for an @font-face file

		Just create a "fonts" folder at the root,

		copy your FontName into code below and remove

		comment brackets */



/*	@font-face {

	    font-family: 'FontName';

	    src: url('http://linusventures.com/fonts/FontName.eot');

	    src: url('http://linusventures.com/fonts/FontName.eot?iefix') format('eot'),

	         url('http://linusventures.com/fonts/FontName.woff') format('woff'),

	         url('http://linusventures.com/fonts/FontName.ttf') format('truetype'),

	         url('http://linusventures.com/fonts/FontName.svg#webfontZam02nTh') format('svg');

	    font-weight: normal;

	    font-style: normal; }

*/