/******************************************************************
Theme Name: Webfolio
Theme URI: http://www.s5themes.com/theme/webfolio/
Description:  Webfolio - Check <a href="http://www.s5themes.com/documentation/webfolio/">Webfolio Documentation</a> in case you need directions or get support from <a href="http://www.s5themes.com/forums/">Forum</a>.
Author: Site5.com
Author URI: http://gk.site5.com/t/536
Version: 2.0

License: GPL
License URI: http://www.gnu.org/copyleft/gpl.html
******************************************************************/
 


/* MAIN STYLES
-------------------------------------------*/
* { margin: 0; padding: 0; }

body,html {
	font-weight:normal;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333;
	background:#EFEFEF url(library/images/bk_body.jpg) repeat-x;
}

ul {
	list-style:none;
}

ul, ol {
    margin: 0.5em 0;
}

a {
	text-decoration:none;
}

a:hover {
	text-decoration:underline;
}

a:focus {
	outline:none;
}

p {
	margin:0 0 1em;
}



h1, h2, h3 {
	font-size:28px;
	line-height:100%;
	padding-bottom:15px;
}

h2 {
	font-size:20px;
	padding-top:10px;
	font-weight:normal;
}

h3 {
	font-size:16px;
	padding-top:10px;
}

 /* LAYOUT STRUCTURE
--------------------------------------------------*/
#wrapper {
	margin:0 auto;
	width:960px;
}

header {
	height:195px;
	position:relative;
	z-index:99; 
	padding:0 8px;
	background:url(library/images/bk_header.jpg) 100% 0 no-repeat;
}

#content {
	padding:15px 0 50px;
}

section{
	width:655px;
	float:left;	
	
}

/* page container for Portfolio */
section.colFull{	
	width:960px;
}

aside {
	padding:8px;
	float:left;
	width:256px;
	border:1px solid #ccc;
	background:#f9f9f9;
	margin-left:27px;
	margin-top:15px;
	font-size:12px;
	border-radius:6px;
}

aside #inner {
	padding:10px;
	background:url(library/images/bk_colright.jpg);
}

footer {
	/*background:#000 url(library/images/bk_footer.jpg) 0 0 repeat-x;*/
	background:#000;
	margin:0;
    color:#333;
	position:relative;
	font-size:12px;
	padding-bottom:20px;
}

#innerFooter {
	width:960px;
	margin:0 auto;
	padding:25px 0 35px;
	position:relative;
}

/* HEADER ELEMENTS
------------------------------------------*/
#site5top {
	position:absolute;
	top:17px;
	right:8px;
}

#site5top a {
	display:block;
	width:197px;
	height:22px;
	text-indent:-9999px;
	background:url(library/images/site5_top.png) 0 0 no-repeat;
}

/* -- logo --*/
#logo {
	position:absolute;
	top:36px;
	left:5px;
	color:#FFF;	
}


#logo a img{
	border:none;
	vertical-align:middle;
	margin-right:20px;
}

#logo a {
	font-size:40px;
	font-weight:bold;
	color:#ddd;
}

#logo h1 {
	margin:0;
	padding:0;
	font-weight:bold;
}

#logo a:hover {
	text-decoration: none;
}

#logo span {
	font-size:11px;
	padding-top:8px;
	text-transform: uppercase;
	color:#888;
	display:block;
}

/* -- search --*/

#searchTop {
	position:absolute;
	right:0;
	top:49px;
}

/* -- main menu --*/

nav {
	width:960px;
	height:46px;
	position:absolute;
	top:125px;
	left:0;
	-webkit-box-shadow: 0 6px 6px -6px #999;
	-moz-box-shadow: 0 6px 6px -6px #999;
	box-shadow: 0 6px 6px -6px #999;
}


nav ul.sf-menu {
	padding-top:14px;
	padding-left:3px;
}

nav ul.sf-menu li {
	float:left;
	padding:0 15px;
	font-size:12px;
}
nav ul.sf-menu li a {
	text-decoration:none;
	text-transform:uppercase;
	font-weight:bold;
	padding:4px 0;
}

nav ul.sf-menu li a:hover {
	text-shadow:none;
}

nav ul.sf-menu li li {
	padding:0;
	border:none;	
}

nav ul.sf-menu li li a {
	font-weight:normal;
	padding:4px 12px;
}

nav ul.sf-menu li ul.children, nav ul.sf-menu li ul.sub-menu {
	padding:5px 0;	
	display:block;
	border-radius:0 0 6px 6px;
	box-shadow: 0 6px 6px -6px #999;
}

nav ul.sf-menu li ul.children li, nav ul.sf-menu li ul.sub-menu li, nav ul.sf-menu li.page_item ul li  {

	position:relative;

	line-height:100%;

	height:28px;

	text-transform:none;

}

nav ul.sf-menu li ul.children li a, nav ul.sf-menu li ul.sub-menu li a, nav ul.sf-menu li.page_item ul li a {

	text-decoration: none;

	display:block;

	padding-top:7px;

	line-height:100%;

	border:none;

	text-transform:none;
}

nav ul.sf-menu li ul.children li ul.children a, nav ul.sf-menu li ul.sub-menu li ul.sub-menu a {

	text-decoration: none;

	position:relative;

	border:none;
}

nav ul.sf-menu li ul.children, nav ul.sf-menu li ul.sub-menu,  nav ul.sf-menu li.page_item ul

{
	margin-top:-4px;
}

nav ul.sf-menu li ul.children ul.children, nav ul.sf-menu li ul.sub-menu ul.sub-menu
{
	margin:0 0 0 25px;
}


#socialIcons {
	position:absolute;
	right:0;
	top:133px;
	margin:0.5em 0;
}

#socialIcons li {
	float:left;
	padding:0 10px;
}

#socialIcons li a {
	display:block;
	text-indent: -9999px;
	width:24px;
	height:19px;
}

#socialIcons li a:hover {
	background-position:0 -19px;
}

#socialIcons .twitter {
	background:url(library/images/ico_twitter.png) 0 0 no-repeat;
}

#socialIcons .facebook {
	background:url(library/images/ico_facebook.png) 0 0 no-repeat;
}

#socialIcons .flickr {
	background:url(library/images/ico_flickr.png) 0 0 no-repeat;
}

#socialIcons .linkedin {
	background:url(library/images/ico_linkedin.png) 0 0 no-repeat;
}

#socialIcons .vimeo {
	background:url(library/images/ico_vimeo.png) 0 0 no-repeat;
}

#socialIcons .googleplus {
	background:url(library/images/ico_google.png) 0 0 no-repeat;
}


#socialIcons .rss {
	background:url(library/images/ico_rss.png) 0 0 no-repeat;
}


/* CONTENT ELEMENTS

----------------------------------------------*/

section h1 {
	padding-bottom:25px;
}

.project-pagination{
   float:right;
   margin-top:10px;  
}
.project-pagination a {
   font-family:"Georgia",Arial,Verdana;
   font-size:14px;
   color:#d7d7d7;
   font-style:italic;
   margin:0px 5px 0 0;
}
.project-pagination a:hover{color:#9dcedf;}



ul#portfolio-items-one-third {
   width: 100%;
   min-height: 300px;
   overflow: hidden;
   list-style: none; 
}
ul#portfolio-items-one-third li {  width:307px;min-height:340px; float: left; overflow: hidden;}
ul#portfolio-items-one-third li .portfolio-item{ float:left; background:#f8f9f9;width:307px;height:auto;padding:0;}
ul#portfolio-items-one-third li .item-content{background:#615951;float:left;width:317px;text-align:center;padding:0px 0 15px 0;height:auto; }
#portfolio-items-one-third  .description{padding-top:15px; }
ul#portfolio-items-one-third li .item-content:hover{ background:#9dcedf;}
ul#portfolio-items-one-third li .item-content p{margin:0;padding:0;font-weight:800;color:#FFF;} 
ul#portfolio-items-one-third li .item-content p a{margin:0;padding:0;font-weight:800;color:#FFF;} 
ul#portfolio-items-one-third li .item-content span{font-style:italic;color:#FFF;} 
ul#portfolio-items-one-third li  img{ width:100%;height:auto;padding:0;margin:0; }
.portfolio-container{} 
.portfolio-items {
  width: 960px;
  margin: 0;
}
.portfolio-items:after {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}

.portfolio-items li {
  width: 307px;
  margin-right:19px;
  margin-bottom:10px;
  display:inline-block;
	vertical-align: top;
	*zoom:1; 
	*display:inline;
	overflow:hidden;
}

.portfolio-items li:nth-child(3n) {
	margin-right:0;
}
 
 .portfolio-items-not-filterable {
  width: 960px;
  margin: 0;
}
.portfolio-items-not-filterable:after {
  content: "";
  display: block;
  height: 0;
  overflow: hidden;
  clear: both;
}

.portfolio-items-not-filterable li {
  width: 310px;
  margin: 0 20px 20px 0;
  float: left;
  overflow: hidden;
}

.three-fourth .portfolio-container {
   width:auto;
}

.boxgrid{ 
	width: 298px; 
	height: 250px; 
	margin:6px 9px 6px 0; 
	float:left; 
	border:4px solid #FFF;
	overflow: hidden; 
	position: relative; 
}
.boxgrid img{ 
		position: absolute; 
		top: 0; 
		left: 0; 
		border: 0; 
}
.boxgrid p{ 
		
		color:#999; 
		line-height:120%;
		padding: 0 10px 5px;
		margin:0;
}

.boxgrid p a.title {
	font-size:14px;
	color:#CED535;
}
	
.boxcaption{  
	font-size:11px;
	float: left; 
	width: 290px; 
    padding: 0 8px;
}

.boxcaption p {
    margin: 0 0 0.5em;
}

.pp_social .facebook {
    width: 90px !important;
}

.captionfull .boxcaption {
		top: 140px;
		left: 0;
}
.caption .boxcaption {
		top: 140px;
		left: 0;
}

.filterable {
	float: right;
    list-style: none;
    margin-top: -45px;
    position: relative;
}

.filterable li {
	float:left;
	padding:0 3px;
	line-height:100%;
}

.filterable li a{
	color:#fff;
	letter-spacing:normal;
    text-transform: capitalize; 
    display:block;
    padding:6px 12px;
    border-radius: 4px;
    background:#333;
}

.filterable li a:hover {
	text-decoration: none;
}

.portfolioimg {
    float: left;
    clear: both;
    width: 100%;
    margin: 0 0 10px 0;
    text-align: center;
}

#archive-title, .searchQuery {
	padding:0 0 10px 0;
	font-size:12px;
	margin-bottom:20px;
	background:url(library/images/bk_separattor_horiz.jpg) 0 100% repeat-x;
}

.alignleft {
	float:left;
	margin:5px 10px 5px 0;
}

.alignright {
	float:right;
	margin:5px 0 5px 10px;
}

#homeBoxes {
	padding-top:15px;
}

#homeBoxes .homeBox {
	width:292px;
	float:left;
	margin-right:40px;
}

#homeBoxes .homeBox:nth-child(3n) {
	margin-right:0;
}


#homeBoxes .last{
	margin-right:0;
}

#homeBoxes .homeBox h2 {
	padding:0 0 25px;
}

.more-link {
	display:block;
	width:92px;
	height:30px;
	line-height:30px;
	font-size:12px;
	clear:both;
	text-align: center;
	text-transform: uppercase;
}

.more-link:hover {
	text-decoration:none;
}

article {
	background:url(library/images/bk_separattor_horiz.jpg) 0 100% repeat-x;
	padding-bottom:10px;
	margin-bottom:20px;
}

article .meta {
	height:34px;
	font-size:11px;
	line-height:34px;
	padding-left:48px;
	position:relative;
	margin:0 0 20px;
	text-shadow:#efefef 1px 1px;
	color:#999;
}

article .meta img {
	vertical-align:middle;
	margin-right:3px;
}

article .meta .date{
	position:absolute;
	left:1px;
	top:-3px;
	width:39px;
	height:44px;
	text-align:center;
	text-transform:uppercase;
	padding-right:1px;
	line-height:155%;
	text-shadow:none;
}

article .meta .date strong {
	font-size:20px;
}

section article p img {
	margin:0 10px 10px 0;
	border:8px solid #fff;
}

/* share icons */
section .social {
	padding:10px 0;
	background:url(library/images/bk_separattor_horiz.jpg) 0 100% repeat-x;
	margin-bottom:10px;
}

section .social a img {
	padding:0;
	border:none;
	background:none;
	vertical-align:middle;
}

section .social strong {
	padding-right:10px;
}

section ul {
	list-style:disc;
	list-style-position:inside;
}

/* COL RIGHT
-------------------------------------------*/

aside h3{
	text-transform:uppercase;
	font-size:15px;
	padding:0;
	margin-bottom:10px;
	padding-bottom:10px;
	font-weight:bold;
	border-bottom:2px solid #fff;
}

aside ul {
	padding-bottom:5px;
	margin-bottom:0;
}

aside ul li {
	border-bottom:1px dotted #D1D1D1;
	padding:7px 0 7px 12px;
}

aside .sidebar_widget {
	margin-bottom:20px;

}
/* FOOTER ELEMENTS
--------------------------------------------*/
.textwidget {
    padding-top:10px;
}

footer .footerBox {
	width:292px;
	float:left;
	margin-right:40px;
	background:url(library/images/bk_dotted_thick.png) 0 0 repeat-x;
}

footer .footerBox:last-child {
	margin-right:0;
}

footer .footerBox {
	background:none;
}

footer .footerBox h3  {
	padding-bottom:15px;
	margin-bottom:15px;
	color:#ccc;
	border-bottom:1px solid #292929;
}

footer .last{
	margin-right:0;
}

footer .footerBox ul li {
	padding:7px 0;
	padding-left:12px;
}


footer .footerBox ul li a {
	text-decoration:none;
}

#copy {
	clear:both;
	padding:20px 0 10px;
}

footer #footerMenu ul li{
	float:left;
	padding:0 12px;
	border-left:1px solid #292929;
	line-height:100%;
}


#site5bottom {
	position:absolute;
	right:0;
	bottom:30px;
    text-align: right;
}

/* PAGINATION */
#pagination {   list-style: none; margin-top:10px; }
 #pagination li {   display: inline }
  #pagination span,  
  #pagination a  {
     display: block;
     float: left;
     padding: 4px 10px;
     margin-right: 7px;
     border: 1px solid #e1e1e1;
     -webkit-box-shadow: inset 0 0 10px #f5f5f5;
     -moz-box-shadow: inset 0 0 10px #f5f5f5;
     box-shadow: inset 0 0 10px #f5f5f5;
     border-radius: 2px;
     -moz-border-radius: 2px;
     -webkit-border-radius: 2px;
     color: #333;
  }
 #pagination .current  {   background-color: #fefefe }
 #pagination .current:hover {   border: 1pt solid #c2c2c2 }

/* HOME SLIDER
-----------------------------------------------*/

#slider{
	padding:0;
	height:370px;
    overflow: hidden; 
    margin-bottom:25px;
}

 #slider_container {
 	margin-bottom:15px;
 }

/*COMMENTS
---------------------------------------------*/

section h2.comments {
	padding-bottom:20px;
	background:url(library/images/bk_separattor_horiz.jpg) 0 100% repeat-x;
}

section ul.commentlist {
	list-style-type:none;
	background:url(library/images/bk_separattor_horiz.jpg) 0 100% repeat-x;
	padding-bottom:20px;
	margin-bottom:15px;
}

section ul.commentlist li {
	margin-top:15px;
}

section ul.commentlist li .text {
	position:relative;
	padding:12px;
	background:#fff;
	border:1px solid #D1D1D1;
}

section ul.commentlist li .text .topLeft {
	position:absolute;
	top:-1px;
	left:-1px;
	width:12px;
	height:12px;
	background:url(library/images/bk_comment_top_left.jpg) 0 0 no-repeat;
}

section ul.commentlist li .text .topRight {
	position:absolute;
	top:-1px;
	right:-1px;
	width:12px;
	height:12px;
	background:url(library/images/bk_comment_top_right.jpg) 0 0 no-repeat;
}

section ul.commentlist li .text .bottomRight {
	position:absolute;
	bottom:-1px;
	right:-1px;
	width:12px;
	height:12px;
	background:url(library/images/bk_comment_bottom_right.jpg) 0 0 no-repeat;
}

section ul.commentlist li .text .bottomLeft {
	position:absolute;
	bottom:-1px;
	left:-1px;
	width:12px;
	height:12px;
	background:url(library/images/bk_comment_bottom_left.jpg) 0 0 no-repeat;
}

section ul.commentlist li .text .bubble {
	position:absolute;
	top:-9px;
	left:16px;
	width:16px;
	height:10px;
	background:url(library/images/bk_bubble.png) 0 0 no-repeat;
}

section ul.commentlist .commentmetadata span {
	font-size:12px;	
}


section ul.commentlist li .avatar {
	border:5px solid #FFF;
	padding:1px;
	background:#fff;
	float:left;
	margin-right:5px;
	margin-bottom:5px;
}

section ul.commentlist li em {
	font-size:12px;
	padding-top:5px;
}

section ul.commentlist li ul.children {
	padding-left:35px;
}

section ul.commentlist li .reply {
	font-size:12px;
}

section h2.postComment {
	background:url(library/images/ico_arrow_post.png) 3px 50% no-repeat;
	padding-left:28px;
}


/* FORMS
-------------------------------------------*/

#searchform input{
	border:none;
	border-radius:4px;
	box-shadow:1px 1px 1px #AAAAAA inset;
	padding: 9px 12px;
    width: 220px;
    background:#f3f3f3 url(library/images/ico_search.png) 96% 50% no-repeat;
    font-family:'Georgia','Times New Roman', serif;
    font-style:italic;
    font-size:12px;
    padding-right:30px;
    color:#666;
}

/* post comment */

#commentform p {
	margin:0;
}

#commentform label {
	display:block;
	padding:5px 0 2px;
}

#commentform input, #commentform textarea {
	font-family:Arial, Helvetica, sans-serif;
	width:300px;
	font-size:12px;
	border:none;
	border-radius:4px;
	box-shadow:1px 1px 1px #ccc inset;
	padding: 9px 12px;
}

#commentform textarea {
	width:600px;
}

#commentform input#submit{
	border:none;
	width:100px;
	height:34px;
	margin-top:15px;
	border:1px solid #77DDFF;
	border-radius: 6px;
	background:#00AAEB;
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		-moz-linear-gradient(top,  #00c1fa 0%, #0094dd 100%); /* FF3.6+ */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		-webkit-gradient(linear, left top, left bottom, color-stop(0%,#00c1fa), color-stop(100%,#0094dd)); /* Chrome,Safari4+ */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		-webkit-linear-gradient(top,  #00c1fa 0%,#0094dd 100%); /* Chrome10+,Safari5.1+ */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		-o-linear-gradient(top,  #00c1fa 0%,#0094dd 100%); /* Opera 11.10+ */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		-ms-linear-gradient(top,  #00c1fa 0%,#0094dd 100%); /* IE10+ */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		linear-gradient(to bottom,  #00c1fa 0%,#0094dd 100%); /* W3C */
	background:url(../images/blue/bk_topmenu.png) 100% 0 no-repeat,
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00c1fa', endColorstr='#0094dd',GradientType=0 ); /* IE6-9 */
	color:#fff;
	-webkit-box-shadow: 0 6px 6px -6px #999;
	-moz-box-shadow: 0 6px 6px -6px #999;
	box-shadow: 0 6px 6px -6px #999;
	color:#fff;
}


/* Contact Page */
#contact-map {
    float: left;
    width: 625px; 
    border: 4px #fff solid;
    height: 350px; 
    margin: 0 0 15px 0;
}
#contact-map iframe {
    border: 0; 
}
#contact-form {
    width: 60%; 
    float: left;
    margin: 0 30px 0 0;
}
#contact-data {
    float: left; 
    width: 35%;
    margin: 28px 0 0 0;
}
#contact-data p {
	display:block;
	overflow:hidden;
	margin:0 0 15px 0;
}
#contact-data .contact-data-field {
    float: left;
    width: 35%;
    font-weight: bold; 
}
#contact-data .contact-data-info {
    float: left;
    width: 65%;
}

/* contact */

#contactForm label {
	display:block;
	padding:8px 0 2px;
}

#contactForm input, #contactForm textarea {
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	color:#666;
	width:90%;
	border:none;
	border-radius:4px;
	box-shadow:1px 1px 1px #ccc inset;
	padding: 9px 12px;
}

#contactForm button.submitbutton {
	width:100px;
	height:34px;
	margin-top:20px;
	border-radius: 6px;
	color:#fff;
	-webkit-box-shadow: 0 6px 6px -6px #999;
	-moz-box-shadow: 0 6px 6px -6px #999;
	box-shadow: 0 6px 6px -6px #999;
	color:#FFF;
}

.errormsg, .successmsg{
	background:#FEF4F1;
	border:1px solid #F7A68A;
	color:#DA4310;
	padding:10px;
}

.successmsg {
	background:#F5FAF1;
	border:1px solid #C2E1AA;
	color:#8FA943;
}


/* CLEARING

---------------------------------------------------*/

.clearfix:after {
    content: "."; 
    display:block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
	display: block;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}

/* End hide from IE-mac */

.clear {
    clear: both;
}

.noclear {
	clear: none;
}
.thanks {
background: #F2F3F6;
background: url('library/images/ok.png') no-repeat left 1px;
padding-left:20px;
clear: both;
margin-top: 30px;
}
.error {
color: #333;
background: #FCE2D4 url('library/images/error.png') no-repeat 5px 50%;
margin-top: 5px;
display:block;
clear: both; 
padding:7px;
padding-left:30px;
border-radius:6px;
font-size:11px;
border: 1px solid #fbc2c4;
width:270px;
}