/*
* 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
================================================== */
	
/* 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: #ff5452; 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: #f2504e; }

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active { border: none; background: #f2504e; }


/* #Site Styles
================================================== */

/* portfolio list */

.portfolio { margin:50px 0 0 0; padding:0; -webkit-padding-start:0; }
.portfolio .list { clear: both; -webkit-column-count: 3; /* Chrome, Safari, Opera */
    -moz-column-count: 3; /* Firefox */
    column-count: 3;
	-webkit-column-gap: 38px; /* Chrome, Safari, Opera */
    -moz-column-gap: 38px; /* Firefox */
    column-gap: 38px; }
.portfolio .list li { margin:0 0 34px 0; background:url(../img/bg_book_frame.png) no-repeat top left; background-size:cover; display:inline-block; }
.portfolio .list .thumb { position: relative; height:auto; background:url(../img/bg_book_frame_bottom.jpg) no-repeat bottom left; background-size:contain; padding:10px; cursor:pointer; }
.portfolio .list .view { display:none; text-align:center; position: absolute; top:50%; left:59px; width:250px; height:auto; margin-top:-16%; opacity: 0; visibility: hidden;  }
.portfolio .list .thumb:hover .img { filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'old-timey\'><feColorMatrix type=\'matrix\' values=\'0.14 0.45 0.05 0 0 0.12 0.39 0.04 0 0 0.08 0.28 0.03 0 0 0 0 0 1 0\'/></filter></svg>#old-timey"); -webkit-filter:blur(1px); -webkit-filter:blur(1%); -moz-filter:blur(1%); -ms-filter:blur(1%); -o-filter:blur(1%); filter:blur(1%); opacity:.4; }
.portfolio .list .thumb:hover .view { visibility: visible; opacity: 1; -webkit-transition-delay: 0s; -moz-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; z-index:10; vertical-align:middle; }

.portfolio .list .view h4 { font-family:"college_condensedregular",Georgia,serif; text-transform:uppercase; color:#fff; text-shadow:1px 1px 50px #000; margin:0; }
.portfolio .list .view a { text-shadow:1px 1px 50px #000; text-decoration: none!important; }
.portfolio .list .view .line_separator { margin:10% auto 5% auto; }

/* scroll up */

#scrollUp { display:none; }


@media (min-width: 992px) {
    .portfolio .list .view h4 { font-size:24px; }
    .portfolio .list .thumb { padding:31px 35px; }
    .portfolio .list .view { display:block; }
}