/*************************************************************
** PORTFOLIO
**************************************************************/
section#portfolio{
	position:relative;
	min-height:770px;
	padding:110px 0 0 0px;
}
#portfolio figure.featured{position:absolute;top:20px;left:20px;z-index:0;}
#portfolio figure.back-items{position:absolute;top:110px;left:110px;z-index:0;}
#portfolio nav{
	position:absolute;
	top:40px;
	left:0px;
}
#portfolio nav ul{position:relative;width:750px;#width:810px;height:30px;}
#portfolio nav ul#nav-works li{width:auto;height:auto;margin:4px 15px 0 0;font-size:1.7em;#font-size:1.5em;visibility:hidden;}
#portfolio nav ul#nav-works li#nav-first-child{height:auto;text-indent:10px;padding:20px 30px 20px 40px;margin:-13px -30px 0 30px;background:url(../images/icons/filter-tag.png) 10px 15px no-repeat;visibility:visible;cursor:default;}
#portfolio nav ul#nav-works li.fade-option{}
#portfolio nav ul#nav-works li.fade-option a{
	display:block;
	text-decoration:none;
	color:#1d1d1d;
	padding:5px;
	-webkit-transition: all .15s ease;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease;
	}
#portfolio nav ul#nav-works li a.current, #portfolio nav ul#nav-works li a:hover{
	color:#ffffff;
	border-radius:5px;
	background-color: #b5423f;
}
#portfolio ul{
	position:relative;
	width:1000px;
	float: left;
}
div.mask{
	position:relative;
	float:left;
	width:1000px;
	height: 644px;
	overflow:hidden;
}
#portfolio ul li{
	position:relative;
	display:block;
	float:left;
	margin:0 1px 1px 0;
	width:160px;
	height:160px;
	}
#portfolio ul li figure{position:absolute;}
#portfolio ul li a{display:block;}
/*#portfolio ul li a.preload {background:url('if-you-want-a-loader-icons-here-the-path.gif') center center no-repeat;}*/
#portfolio ul li div.work-caption{
	position:relative;
	width:140px;
	height:140px;


	#width:180px;
	#height:120px;
	#top:0px;
	#margin-left:0px;
	color:#FFF;
	padding:10px;
	visibility:hidden;
	z-index:1000;
	overflow:hidden;
	background-color: #b5423f;
	background-image: url(../images/backgrounds/info-box-bg.jpg);
}
#portfolio ul li div.work-caption h3{}
#portfolio ul li div.work-caption span,div.work-caption a {display:block;line-height:1.3em;#text-indent:-9999px;}

/*IF YOU NEED/WANT TO USE A MAGNIFY ICON FOR YOUR HOVER ACTION JUST USE THE FOLLOWING COMMENTED LINES
#portfolio ul li div.work-caption h3 a{display:block;width:width-size-of-your-icon-in-px;height:height-size-of-your-icon-in-px;background: url(your-image-icon-path) no-repeat;}
#portfolio ul li div.work-caption span,div.work-caption h3 a{text-indent:-9999px;}*/

div.work-caption a{#text-indent:0px;}/*styles only for IE7 alternative view as result of z-index bug*/
#portfolio ul li div.work-caption h3 a.caption-title{text-transform:uppercase;text-align:center;font-size:1em;#font-size:2.5em;#line-height:40px;width:130px;text-decoration:none;padding:10px 0 10px 0;margin:5px;}
#portfolio ul li div.cap-special h3 a.caption-title{font-size:1.5em;text-align:left;padding:5px 0 3px 0;margin:0 0 10px 0;}
#portfolio ul li div.cap-special h3 small.client{/*text-transform:uppercase;*/}
#portfolio ul li div.cap-special h3 small.brief{font-size:1.1em;line-height:1.3em;}
/*#portfolio ul li div.work-caption h3 a.caption-title{#border:none;#margin-top:55px;}styles only for IE7 alternative view as result of z-index bug*/
#portfolio ul li div.work-caption h3.plus a.caption-title{border:none;font-size:4em;}/*style if you want a plus icon for magnify works*/
div#pagination{
	position:relative;
	margin:30px 0 0 445px;
	float:left;
}
div#pagination span{font-size:2em;}
div#pagination span.arrow a{
	display:inline-block;
	text-decoration:none;
	color:#1d1d1d;
	padding:15px;
	margin:3px;
	text-decoration:none;
	color:#ffffff;
	border-radius:50%;


	-webkit-transition: all .15s ease;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;
	-webkit-transition: all .15s ease-in-out;
	transition: all .15s ease;
	background-color: #b5423f;
	}
div#pagination span#arrow-right a{
	background-color: #b5423f;
	background-image: url(../images/icons/btns/down-arrows.png);
	background-repeat: no-repeat;
	background-position: 3px -55px;
}
div#pagination span#arrow-right a:hover{
	background-color: #c66d5c;
	background-image: url(../images/icons/btns/down-arrows.png);
	background-repeat: no-repeat;
	background-position: 3px 12px;
}
div#pagination span#arrow-left a{
	background-color: #b5423f;
	background-image: url(../images/icons/btns/up-arrows.png);
	background-repeat: no-repeat;
	background-position: 3px 11px;
}
div#pagination span#arrow-left a:hover{
	background-color: #c66d5c;
	background-image: url(../images/icons/btns/up-arrows.png);
	background-repeat: no-repeat;
	background-position: 3px -55px;
}

/*************************************************************
*** FOOTER
**************************************************************/

/*********************************************
****** SPECIAL
*********************************************/