/*
Theme Name: Next vCard - Responsive Wordpress Personal Theme
Theme URI: http://nextwpthemes.com/themes/vcard-wp/
Author: nextWPthemes
Author URI: http://www.nextwpthemes.com
Description: Next vCard is a Clean and premium online vCard ideal for businesses and freelancers. It’s absolutely perfect for displaying your skills and experiences and to showcase your amazing portfolio. It is fully responsive, so you do not have to worry if your visitors are viewing your site on an iPhone, iPad or a computer. Next vCard comes with a home jQuery slider, a beautiful portfolio with filtering effect, resume and contact information with Google map.
Version: 1.2.0
License: GNU General Public License
License URI: license.txt
*/
/*-------------------------------------------------*/
/* =  Reset
/*-------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

input, select, textarea {
	outline: none;
}

/*-------------------------------------------------*/
/* =  Main Content Styles
/*-------------------------------------------------*/
address { font-style: italic; }

abbr[title],
acronym[title],
dfn[title] {
	cursor: help;
	border-bottom: 1px dotted #666;
}

strong { font-weight: bold; }

em,
dfn,
cite { font-style: italic; }

dfn { font-weight: bold; }

sup {
	font-size: 11px;
	vertical-align: top;
}

sub {
	font-size: 11px;
	vertical-align: bottom;
}

small { font-size: 11px; }

del { text-decoration: line-through; }

ins { text-decoration: underline; }

code,
pre { line-height: 18px; }

var,
kbd,
samp,
code,
pre {
	font: 11px/19px Courier, "Courier New";
	color: #333;
	background: #f8f8f8;
}

kbd { font-weight: bold; }

samp,
var { font-style: italic; }

pre {
	white-space: pre;
	overflow: auto;
	padding: 10px;
	margin: 40px;
	clear: both;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

code { padding: 3px; }

table {
	border: 1px solid #ccc;
	border-width: 1px;
	line-height: 18px;
	margin: 0 0 22px 0;
	text-align: left;
	padding: 0 5px;
}

table .even { background: #ddd; }

caption { text-align: left; }

tr { border-bottom: 1px solid #ccc; }

th,
td {
	padding: 5px;
	vertical-align: middle;
	text-align: center;
}

/*-------------------------------------------------*/
/* =  General Style
/*-------------------------------------------------*/
html {
	overflow: hidden;
}

body {
	font-family: arial;
	font-size: 12px;
	color: #666;
	background: #ededed;
}

#container {
	width: 800px;
	margin: auto;
}

a {
	text-decoration:none;
	transition: color 0.2s linear;
	-moz-transition: color 0.2s linear;
	-webkit-transition: color 0.2s linear;
	-o-transition: color 0.2s linear;
	outline: none;

	color: #4C8EB9;
}

a:hover {
	color: #70A4C7;
}

p {
	color: #747474;
	font-size: 13px;
	line-height: 24px;
}

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

.clearfix {
    zoom: 1;
}

.padding {
	padding: 20px;
}

/*-------------------------------------------------*/
/* =  Loading Effect
/*-------------------------------------------------*/
#loading-container {
	position: absolute;
	left: 50%;
	margin-left: -400px;
	top: 179px;
	width: 800px;
	height: 2px;
	z-index: 999;
	background: #fff;
	display: none;
}

#loading {
	float: left;
	height: 2px;
	width: 0px;
	background: #619D21;
}

/*-------------------------------------------------*/
/* =  Header
/*-------------------------------------------------*/
#logo {
	float: left;
	padding: 38px 0 12px 0;
}

#logo .name {
	margin-bottom: 3px;
}

#logo .name a {
	font-family: 'Verdana';
	font-weight: bold;
	font-size: 20px;
	color: #414141;
}

#logo .tagline {
	font-family: 'Times New Roman';
	font-style: italic;
	font-size: 15px;
	color: #838383;
}

header nav {
	clear: both;
	background: #000000;
	padding: 25px 25px 10px 25px;
	/*overflow: hidden;*/
	margin-bottom: 20px;
}

/* -- Superfish Style -- */
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu > li {
	float: none !important;
}
.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			2.5em; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
.sf-menu li li {
	background: #fff;
	padding-right: 0px;
	padding-bottom: 10px;
}
.sf-menu li li li {
	background: #fff;
	padding-right: 0px;
}
.sf-menu > li > .sub-menu {
	margin-left: -7px;
}
.sf-menu .sub-menu {
	margin-left: 1px;
	-moz-box-shadow: 0 0 2px #888;
	-webkit-box-shadow: 0 0 2px#888;
	box-shadow: 0 0 2px #888;
}
.sf-menu .sub-menu li:first-child {
	padding-top: 10px;
}
.sf-menu .sub-menu a {
	padding: 0 10px;
	text-transform: none;
	font-weight: normal;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	outline: 0;
	//color: #619d21;
	color: #e18b6b;
}

header nav li {
	display: inline-block;
	padding-right: 40px;
	height: 16px;
	line-height: 16px;
	padding-bottom: 15px;
}

header nav > li:last-child {
	padding-right: 0px;
}

header nav li a {
	font-size: 13px;
	font-weight: bold;
	color: #ffffff;
	display: block;
	text-transform: uppercase;
}

header nav li a:hover {
	//color: #595959;
	color: #e18b6b;
}

header nav li a.active {
	//color: #619d21;
	color: #e18b6b;
}

#social-media {
	float: right;
	margin-top: 62px;
}

#social-media li {
	float: left;
	margin-left: 10px;
}

#social-media li:first-child {
	margin-left: 0px;
}

#social-media a {
	display: block;
	text-align: center;
	width: 16px;
	height: 16px;
	line-height: 16px;
}

/*-------------------------------------------------*/
/* =  Content
/*-------------------------------------------------*/
#content {
	/*margin-top: 20px;*/
	background: #fff;
	/*visibility: hidden;
	overflow: hidden;*/
	display: none;
}

#archive-title {
	font-size: 15px;
	color: #848484;
	margin-bottom: 18px;
}

#archive-title span {
	font-family: 'Times New Roman';
	font-size: 13px;
	font-style: italic;
	color: #848484;
}

.post-content p {
	margin-bottom: 10px;
}

/* H Group*/
.post-content h1 {
	font-size: 42px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post-content h2 {
	font-size: 38px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post-content h3 {
	font-size: 34px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post-content h4 {
	font-size: 30px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post-content h5 {
	font-size: 26px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post-content h6 {
	font-size: 22px;
	font-weight: bold;
	color: #5c5c5c;
	margin-bottom: 10px;
}

.post.new {
	display: none;
}

/* List Style */
.post-content ul, .post-content ol {
	margin: 0 0 15px 20px;
	color: #4D4D4D;
}

.post-content ul ul,
.post-content ul ol,
.post-content ol ul,
.post-content ol ol {
	margin: 5px 0 5px 20px;
}

.post-content li {
	line-height: 20px;
}

.post-content ul li {
	list-style: disc;
}

.post-content ol li {
	list-style: decimal;
}

/*-------------------------------------------------*/
/* =  Home - Flexslider
/*-------------------------------------------------*/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}

.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block; width: 100% !important; height: 100% !important; }
.flex-pauseplay span {text-transform: capitalize;}

/* -- Clearfix for the .slides element -- */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

.no-js .slides > li:first-child {display: block;}

.flexslider .slides {zoom: 1;}
.flexslider .slides > li {position: relative;}
.flex-container {zoom: 1; position: relative;}

#slider-container {
 	position: relative;
 	width: 800px;
 	height: 335px;
}

#slider-bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	z-index: 15;
	cursor: pointer;
 	background: url(img/slider-bg.png) no-repeat;
}


#slider-bg:after {
	content: '';
	height: 0px;
	width: 0px;
	position: absolute;
	right: 0px;
	bottom: 0px;
	border: 114px solid transparent;
	border-right-color: #000000;
	border-bottom-color: #000000;
}

.flexslider {
	position: relative;
	width: 100%;
	height: 100%;
}

.flex-caption {
	position: absolute;
	top: 107px;
	right: 2px;
	padding: 11px 70px 11px 20px;
	-moz-box-shadow: 0px 0px 3px #ccc;
	-webkit-box-shadow: 0px 0px 3px #000000;
	box-shadow: 0px 0px 3px #000000;
	z-index: 8;
	background: url(img/caption-bg.png) repeat;
	max-width: 350px;
	max-height: 70px;
}

.flex-caption p {
	font-family: 'Times New Roman';
	font-style: italic;
	line-height: 20px;
	font-size: 12px;
	color: #fff;
	overflow: hidden;
	max-height: 60px;
}

.flex-caption a {
	color: #050505;
}

.flex-caption a:hover {
	color: #555;
}

/* -- Direction Nav -- */
.flex-direction-nav {
	position: absolute;
	bottom: 20px;
	right: 23px;
	width: 30px;
	height: 26px;
	z-index: 21;
	background: url(img/direction-nav-bg.png) no-repeat;
	padding: 26px 24px;
}

.flex-direction-nav li a {
	cursor: pointer;
	transition: background 0.2s linear;
	-moz-transition: background 0.2s linear;
	-webkit-transition: background 0.2s linear;
	-o-transition: background 0.2s linear;
}

.flex-direction-nav li a.prev {
	text-indent: -9999px;
	float: left;
	width: 13px;
	height: 25px;
	background: url(img/prev-nav.png) no-repeat;
}

.flex-direction-nav li a.prev:hover {
	background: url(img/prev-nav-hover.png) no-repeat;
}

.flex-direction-nav li a.next {
	text-indent: -9999px;
	display: block;
	float: right;
	width: 13px;
	height: 25px;
	background: url(img/next-nav.png) no-repeat;
}

.flex-direction-nav li a.next:hover {
	background: url(img/next-nav-hover.png) no-repeat;
}


/* -- Control Nav -- */
.flex-control-nav {
	padding: 8px 2px 8px 10px;
	background: url(img/bullets-bg.png) repeat;
	position: absolute;
	right: 232px;
	bottom: 11px;
	z-index: 16;
}

.flex-control-nav:after {
	content: url(img/control-bg-right.png);
	position: absolute;
	bottom: 0px;
	right: -27px;
	width: 27px;
	height: 26px;
	z-index: 21;
}

.flex-control-nav li {
	position: relative;
	float: left;
	width: 10px;
	height: 10px;
	margin-left: 6px;
	z-index: 9;
}

.flex-control-nav li:first-child {
	margin-left: 0px;
}

.flex-control-nav li a {
	float: left;
	width: 10px;
	height: 10px;
	background: #fff;
	text-indent: -9999px;
	cursor: pointer;
}

.flex-control-nav a.active {
	background: #619D21;
	cursor: default;
}

/*-------------------------------------------------*/
/* =  About
/*-------------------------------------------------*/
.about aside {
	float: left;
	width: 188px;
	padding: 25px 0px 20px 20px;
	border-right: 1px dotted #939393;
}

.about #photo {
	position: relative;
	text-align: center;
	margin-right: 20px;
	margin-bottom: 20px;
}

.about #photo img {
	//height: 141px;
	//width: 129px;
}

.about #photo:after {
	//content: url(img/photo-shadow.png);
	position: absolute;
	bottom: 0px;
	left: -6px;
}

#skills {
	margin-top: 20px;
}

#skills h3 {
	position: relative;
	text-transform: uppercase;
	color: #5f5f5f;
	font-size: 13px;
	height: 25px;
	line-height: 25px;
	font-weight: bold;
}

#skills h3 span {
	background: #fff;
	position: relative;
	padding-right: 10px;
}

#skills h3:before {
	content: '';
	position: absolute;
	top: 12px;
	left: 0px;
	right: 0px;
	height: 0px;
	border-top: 1px dotted #939393;
}

#skills ul {
	margin-right: 20px;
}

#skills li {
	position: relative;
	display: block;
	color: #878787;
	padding: 17px 0px 10px 0px;
	border-bottom: 1px dotted #939393;
	border-right: 1px dotted #939393;
}

#skills li:first-child {
	border-right: 0px dotted #939393;
}

#skills div.progressbar {
	position: absolute;
	left: 0px;
	bottom: -3px;
	height: 5px;
	background: #619d21;
}

#contact h2,
.about h2 {
	position: relative;
	color: #619d21;
	font-size: 18px;
	height: 29px;
	font-weight: normal;
	line-height: 29px;
	margin: 21px 0px 2px 0px;
}

#contact h2:before,
.about h2:before {
	content: '';
	position: absolute;
	height: 0px;
	border-bottom: 1px dotted #939393;
	width: 20px;
	left: -33px;
	top: 14px;
}

.about .about-content {
	padding: 20px 33px;
	float: right;
	width: 524px;
	border-left: 1px dotted #939393;
	position: relative;
	left: -1px;
}

.about .about-content h2:first-child,
#contact .left h2:first-child {
	margin-top: 0px !important;
}

blockquote {
	border-left: 2px solid #619d21;
	border-right: 2px solid #619d21;
	padding: 0px 16px;
	margin: 20px 0px;
	font-family: 'Times New Roman';
	color: #828282;
	line-height: 24px;
	font-size: 18px;
	font-style: italic;
}

.about .about-content ul {
	clear: both;
	margin-top: 8px;
}

.about .about-content li {
	float: left;
	width: 234px;
	padding-left: 28px;
	font-size: 11px;
	color: #5a5a5a;
	min-height: 16px;
	line-height: 16px;
	margin-bottom: 10px;
}

.about .about-content li.icon-1 { background: url(img/icon-1.png) no-repeat left top; }
.about .about-content li.icon-2 { background: url(img/icon-2.png) no-repeat left top; }
.about .about-content li.icon-3 { background: url(img/icon-3.png) no-repeat left top; }
.about .about-content li.icon-4 { background: url(img/icon-4.png) no-repeat left top; }
.about .about-content li.icon-5 { background: url(img/icon-5.png) no-repeat left top; }
.about .about-content li.icon-6 { background: url(img/icon-6.png) no-repeat left top; }

/*-------------------------------------------------*/
/* =  Portfolio
/*-------------------------------------------------*/
#portfolio-filter {
	border-bottom: 1px solid #d0d0d0;
	padding-left: 17px;
	position: relative;
	height: 40px;
}

#portfolio-filter li {
	float: left;
	margin-left: 30px;
	padding: 14px 0px;
}

#portfolio-filter li:first-child {
	margin-left: 0px;
}

#portfolio-filter li.back {
	border-top: 3px solid #619d21;
	margin-left: 0px;
	z-index: 99;
	display: block;
	position: absolute;
	bottom: -2px;
	padding: 0px !important;
	height: 0px;
}

#portfolio-filter li a {
	color: #787878;
	font-size: 12px;
	display: block;
}

#portfolio-filter li a:hover {
	color: #619d21;
}

#portfolio-list {
	margin-top: 16px;
	margin-left: 1px;
	width: 798px;
}

#portfolio-list li {
	float: left;
	margin: 0px 0px 16px 16px;
	width: 244px;
	height: 141px;
	overflow: hidden;
}

#portfolio-list li a.image-hover {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	bottom: 0px;
	background: url(img/image-hover-bg.png) repeat;
	display: none;
	cursor: pointer;
}

#portfolio-list li a.image-hover.image:after {
	content: url(img/image-hover.png);
	position: absolute;
	left: 50%;
	top: 50%;
	width: 50px;
	height: 49px;
	margin-left: -25px;
	margin-top: -25px;
	cursor: pointer;
}

#portfolio-list li a.image-hover.video:after {
	content: url(img/video-hover.png);
	position: absolute;
	left: 50%;
	top: 50%;
	width: 50px;
	height: 49px;
	margin-left: -25px;
	margin-top: -25px;
	cursor: pointer;
}

#portfolio-list li img {
	width: 100%;
}

/*-------------------------------------------------*/
/* =  Contact
/*-------------------------------------------------*/
#contact .left {
	width: 300px;
	padding: 20px 20px 17px 34px;
	overflow: hidden;
	float: left;
}

#contact .right {
	width: 373px;
	padding: 0px 20px 17px 25px;
	overflow: hidden;
	float: right;
}

#contact ul {
	margin-bottom: 5px;
}

#contact li {
	display: block;
	height: 19px;
	padding-left: 25px;
	line-height: 20px;
	margin-bottom: 5px;
	font-size: 11px;
	color: #5a5a5a;
}

#contact li a {
	color: #5a5a5a;
}

#contact li.mail {
	background: url(img/mail-icon.png) no-repeat left center;
}

#contact li.phone {
	background: url(img/phone-icon.png) no-repeat left center;
}

#contact li.phone div.name {
	width:200px;
	text-align: left;
	font-style: normal;
	font-weight: bold;
}

#contact li.phone div.name div.number {
	width:100px;
	text-align: right;
	font-style: italic;
	font-weight: normal;
	float: right;
}

#contact li.website {
	background: url(img/website-icon.png) no-repeat left center;
}

#contact form {
	margin-top: 7px;
}

#contact input[type="text"], #contact textarea {
	clear: both;
	float: left;
	font-family: arial;
	font-size: 11px;
	color: #878787;
	font-style: italic;
	padding: 8px 10px;
	border: 1px solid #d6d6d6;
	margin-bottom: 14px;
	width: 180px;
	display: block;
	height: 10px;
}

#contact textarea {
	width: 350px;
	max-width: 350px;
	height: 110px;
	margin-bottom: 10px;
}

#contact input[type="submit"] {
	float: right;
	padding: 7px 23px;
	color: #fff;
	border: none;
	background: #619d21;
	cursor: pointer;

	transition: color 0.2s linear;
	-moz-transition: color 0.2s linear;
	-webkit-transition: color 0.2s linear;
	-o-transition: color 0.2s linear;
}

#contact input[type="submit"]:hover {
	opacity: 0.85;
	-moz-opacity: 0.85;
	filter:alpha(opacity=85);
}

#contact .message {
	float: left;
	max-width: 290px;
	height: 30px;
	margin-top: 2px;
	line-height: 30px;
	overflow: hidden;
	font-size: 11px;
	font-style: italic;
}

#contact .message.error {
	color: #a30000;
}

#contact .message.success {
	color: #619d21;
}

#map-container {
	float: right;
	position: relative;
	width: 356px;
	height: 536px;
	margin: 17px 17px 17px 0px;
	overflow: hidden;
}

#map {
	width: 100%;
	height: 100%;
	max-width: 100%;
	max-height: 100%;
}

#map-container .top-shadow {
	position: absolute;
	left: 0px;
	top: 0px;
	right: 0px;
	height: 14px;
	background: url(img/map-shadow-top.png) no-repeat;
	z-index: 98;
}

#map-container .left-shadow {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 5px;
	bottom: 13px;
	background: url(img/map-shadow-left.png) repeat-y;
	z-index: 98;
}

#map-container .right-shadow {
	position: absolute;
	right: 0px;
	top: 0px;
	width: 5px;
	bottom: 0px;
	background: url(img/map-shadow-right.png) repeat-y;
	z-index: 98;
}

#map-container .bottom-shadow {
	position: absolute;
	left: 0px;
	bottom: 0px;
	width: 372px;
	height: 13px;
	background: url(img/map-shadow-bottom.png) no-repeat;
	z-index: 98;
}

#map-container:after {
	content: url(img/map-image.png);
	position: absolute;
	right: -1px;
	bottom: 0px;
	width: 121px;
	height: 128px;
	z-index: 99;
}

/*-------------------------------------------------*/
/* =  Footer
/*-------------------------------------------------*/
footer {
	margin-top: 10px;
}

footer p {
	font-size: 11px;
	color: #424242;
	line-height: 24px;
}

footer p a {
	color:  #e18b6b;
}

footer p a:hover {
	color: #ffffff;
	background-color: #e18b6b;
}

/*-------------------------------------------------------*/
/* Isotope filtering
/*-------------------------------------------------------*/
.isotope-item {
	z-index: 2;
}
.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1;
}
.isotope, .isotope .isotope-item {/* change duration value to whatever you like */
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	transition-duration: 0.8s;
}
.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width;
}
.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property:-moz-transform, opacity;
	transition-property:transform, opacity;
}
#style-switcher{
	position:absolute;
	left:0;
	top:130px;
	width:25px;
	padding:10px;
	background-color: #000;
	border-radius: 0 4px 4px 0;
	-moz-border-radius: 0 4px 4px 0;
	-webkit-border-radius: 0 4px 4px 0;
}
#style-switcher ul li img{
	margin-bottom:5px;
	border:1px solid #FFF;
}

/*-------------------------------------------------*/
/* =  FancyBox - v2.0.6
/*-------------------------------------------------*/
.fancybox-tmp iframe, .fancybox-tmp object {
	vertical-align: top;
	padding: 0;
	margin: 0;
}

.fancybox-wrap {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 8020;
}

.fancybox-skin {
	position: relative;
	padding: 0;
	margin: 0;
	background: #f9f9f9;
	color: #444;
	text-shadow: none;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
	        border-radius: 4px;
}

.fancybox-opened {
	z-index: 8030;
}

.fancybox-opened .fancybox-skin {
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	   -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
	        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {
	padding: 0;
	margin: 0;
	position: relative;
	outline: none;
}

.fancybox-inner {
	overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
	-webkit-overflow-scrolling: touch;
}

.fancybox-error {
	color: #444;
	font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
	margin: 0;
	padding: 10px;
}

.fancybox-image, .fancybox-iframe {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	padding: 0;
	margin: 0;
	vertical-align: top;
}

.fancybox-image {
	max-width: 100%;
	max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
	background-image: url(img/fancybox/fancybox_sprite.png);
}

#fancybox-loading {
	position: fixed;
	top: 50%;
	left: 50%;
	margin-top: -22px;
	margin-left: -22px;
	background-position: 0 -108px;
	opacity: 0.8;
	cursor: pointer;
	z-index: 8020;
}

#fancybox-loading div {
	width: 44px;
	height: 44px;
	background: url(img/fancybox/fancybox_loading.gif) center center no-repeat;
}

.fancybox-close {
	position: absolute;
	top: -18px;
	right: -18px;
	width: 36px;
	height: 36px;
	cursor: pointer;
	z-index: 8040;
}

.fancybox-nav {
	position: absolute;
	top: 0;
	width: 40%;
	height: 100%;
	cursor: pointer;
	background: transparent url(img/fancybox/blank.gif); /* helps IE */
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	z-index: 8040;
}

.fancybox-prev {
	left: 0;
}

.fancybox-next {
	right: 0;
}

.fancybox-nav span {
	position: absolute;
	top: 50%;
	width: 36px;
	height: 34px;
	margin-top: -18px;
	cursor: pointer;
	z-index: 8040;
	visibility: hidden;
}

.fancybox-prev span {
	left: 20px;
	background-position: 0 -36px;
}

.fancybox-next span {
	right: 20px;
	background-position: 0 -72px;
}

.fancybox-nav:hover span {
	visibility: visible;
}

.fancybox-tmp {
	position: absolute;
	top: -9999px;
	left: -9999px;
	padding: 0;
	overflow: visible;
	visibility: hidden;
}

/* Overlay helper */

#fancybox-overlay {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	z-index: 8010;
	background: #000;
}

#fancybox-overlay.overlay-fixed {
	position: fixed;
	bottom: 0;
	right: 0;
}

/* Title helper */

.fancybox-title {
	visibility: hidden;
	font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
	position: relative;
	text-shadow: none;
	z-index: 8050;
}

.fancybox-opened .fancybox-title {
	visibility: visible;
}

.fancybox-title-float-wrap {
	position: absolute;
	bottom: 0;
	right: 50%;
	margin-bottom: -35px;
	z-index: 8030;
	text-align: center;
}

.fancybox-title-float-wrap .child {
	display: inline-block;
	margin-right: -100%;
	padding: 2px 20px;
	background: transparent; /* Fallback for web browsers that doesn't support RGBa */
	background: rgba(0, 0, 0, 0.8);
	-webkit-border-radius: 15px;
	   -moz-border-radius: 15px;
	        border-radius: 15px;
	text-shadow: 0 1px 2px #222;
	color: #FFF;
	font-weight: bold;
	line-height: 24px;
	white-space: nowrap;
}

.fancybox-title-outside-wrap {
	position: relative;
	margin-top: 10px;
	color: #fff;
}

.fancybox-title-inside-wrap {
	margin-top: 10px;
}

.fancybox-title-over-wrap {
	position: absolute;
	bottom: 0;
	left: 0;
	color: #fff;
	padding: 10px;
	background: #000;
	background: rgba(0, 0, 0, .8);
}

/*-------------------------------------------------*/
/* =  Blog
/*-------------------------------------------------*/
.post:not(.single) {
	border-bottom: 1px dotted #939393;
}

.post-meta {
	float: left;
	width: 160px;
	padding: 20px 20px 20px 27px;
	border-right: 1px dotted #939393;
}

.post-meta .date,
.post-meta .comments {
	text-align: right;
	padding-right: 25px;
	line-height: 17px;
	color: #73777a;
	font-size: 10px;
}

.post-meta .date {
	background: url(img/date-icon.png) no-repeat right center;
	margin-bottom: 7px;
}

.post-meta .comments {
	background: url(img/comment-icon.png) no-repeat right center;
}

.post-tags {
	text-align: right;
	margin-top: 23px;
}

.post-tags a {
	display: inline-block;
	font-size: 10px;
	margin: 7px 0 0 7px;
	color: #fff;
	padding: 4px 6px;
	background: #619d21;
	line-height: 14px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}


.post-tags a {
	transition: background 0.3s linear;
	-moz-transition: background 0.3s linear;
	-webkit-transition: background 0.3s linear;
	-o-transition: background 0.3s linear;
}

.post-tags a:hover {
	background: #535353;
}

.post .postText {
	padding: 20px;
	float: left;
	width: 552px;
	margin-left: -1px;
	border-left: 1px dotted #939393;
}

.post .postText > a {
	float: left;
	background: #fff;
	padding: 7px;
	border: 1px solid #d1d1d1;
	margin:0 20px 0 0;
}

.post .postText > a img {
	border: 1px solid #d1d1d1;
}

.postText .post-title {
	color: #619d21;
	font-size: 15px;
	line-height: 20px;
	font-weight: normal;
	margin-bottom: 8px;
}

.postText .post-title a {
	color: #619d21;
}

.post:not(.single) .post-content {
	max-height: 110px;
	overflow: hidden;
}

.post-content p {
	color: #747474;
	font-size: 12px;
	line-height: 20px;
}

.postText .read-more {
	display: inline-block;
	margin: 6px 0 0 0 !important;
	font-size: 10px;
	color: #fff;
	background: #535353 !important;
	padding: 9px 13px !important;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: none !important;
}

.postText .read-more {
	transition: opacity 0.3s linear;
	-moz-transition: opacity 0.3s linear;
	-webkit-transition: opacity 0.3s linear;
	-o-transition: opacity 0.3s linear;
}

.postText .read-more:hover {
	opacity: 0.70;
	-moz-opacity: 0.70;
	filter:alpha(opacity=70);
}

.load-more {
	float: right;
	width: 592px;
	border-left: 1px dotted #939393;
	padding: 27px 0px;
	text-align: center;
}

.load-more a {
	display: inline-block;
	background: #619d21;
	padding: 18px 20px;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	color: #fff;
}

/*-------------------------------------------------*/
/* =  Single Post
/*-------------------------------------------------*/
.post-image {
	margin-bottom: 20px;
}

.post-image img {
	width: 552px;
}

.single .post-title {
	margin-bottom: 14px;
	font-size: 18px;
	line-height: 24px;
}

/*-------------------------------------------------*/
/* =  Comments
/*-------------------------------------------------*/
.comments-container {
	border-top: 1px dotted #939393;
	border-bottom: 1px dotted #939393;
	padding: 20px 20px 0 20px;
	margin: 20px 0 20px -20px;
	width: 552px;
}

.comments-container .comments-num,
.leave-reply {
	font-size: 16px;
	font-weight: bold;
	color: #5a5a5a;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.author-avatar {
	float: left;
	margin-right: 10px;
}

.author-avatar img {
	width: 50px;
	height: 50px;
}

.comment-author {
	font-size: 14px;
	color: #000;
	margin-bottom: 5px;
}

.comment-author a {
	color: #000;
}

.comment-date {
	font-family: 'Times New Roman';
	font-size: 11px;
	font-style: italic;
	color: #9c9c9c;
	margin-bottom: 5px;
}

.comment-text {
	margin-left: 60px;
}

.comment-text p {
	line-height: 20px;
}

.comment-reply {
	font-size: 11px;
	color: #424242;
	margin: 5px 0 30px 60px;
}

.comment-reply:last-child {
	margin: 5px 0 20px 60px;
}

.comment-reply a {
	display: inline-block;
	color: #424242;
	padding: 5px 10px 6px 10px;
	border: 1px solid #bcbcbc;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

/*-------------------------------------------------*/
/* =  Reply Form
/*-------------------------------------------------*/
#reply input[type="text"],
#reply textarea {
	clear: both;
	float: left;
	border: 1px solid #d6d6d6;
	padding: 6px 10px;
	font-family: 'Times New Roman';
	font-size: 11px;
	font-style: italic;
	color: #878787;
	margin-bottom: 15px;
	width: 250px;
}

#reply textarea {
	min-width: 400px;
	max-width: 400px;
	min-height: 150px;
}

#reply input[type="submit"] {
	clear: both;
	float: right;
	background: #929292;
	border-radius: 20px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	padding: 8px 12px;
	color: #fff;
	border: none;
	margin-right: 130px;
	margin-bottom: 30px;
}

/*-------------------------------------------------*/
/* =  iPads
/*-------------------------------------------------*/
@media screen and (min-width : 726px) and (max-width : 799px) {
	/*-------------------------------------------------*/
	/* =  General Style
	/*-------------------------------------------------*/
	p {
		line-height: 20px;
	}

	#container {
		width: 726px;
	}

	#loading-container {
		margin-left: -363px;
		width: 726px;
	}

	/*-------------------------------------------------*/
	/* =  Home - Flexslider
	/*-------------------------------------------------*/
	#slider-container {
	 	width: 726px;
	 	height: 304px;
	}

	#slider-bg { 	
		background: url(img/responsive/ipad/slider-bg.png) no-repeat;
	}

	#slider-bg:after {
		content: '';
		border: 104px solid transparent;
	}


	/* -- Control Nav -- */
	.flex-control-nav {
		right: 210px;
	}

	/*-------------------------------------------------*/
	/* =  About
	/*-------------------------------------------------*/
	.about .about-content {
		width: 450px;
	}

	.about .about-content blockquote {
		margin: 15px 0px;
		line-height: 22px;
		font-size: 15px;
	}

	/*-------------------------------------------------*/
	/* =  Portfolio
	/*-------------------------------------------------*/
	#portfolio-list {
		width: 724px;
	}

	#portfolio-list li {
		width: 220px;
		height: 127px;
	}

	/*-------------------------------------------------*/
	/* =  Contact
	/*-------------------------------------------------*/
	#contact .left {
		width: 337px;
	}

	#contact textarea {
		width: 313px;
		max-width: 313px;
	}

	#map-container {
		width: 317px;
		height: 524px;
	}

	/*-------------------------------------------------*/
	/* =  SinglePost
	/*-------------------------------------------------*/

	.post .postText {
		width: 478px;
	}

	.post-image img {
		width: 478px;
	}

	.comments-container {
		width: 478px;
	}

	#reply input[type="submit"] {
		margin-right: 55px;
	}

	.load-more {
		width: 518px;
	}
}


/*-------------------------------------------------*/
/* =  Tablet
/*-------------------------------------------------*/
@media screen and (min-width : 438px) and (max-width : 725px) {
	#contact h2,
	.about h2 {
		margin: 14px 0px 2px 0px;
	}

	#contact  h2:before,
	.about h2:before {
		content: '';
		border-bottom: none;
	}

	p {
		font-size: 12px;
		line-height: 20px;
	}

	#container {
		width: 438px;
	}

	#loading-container {
		margin-left: -219px;
		top: 150px;
		width: 438px;
	}

	/*-------------------------------------------------*/
	/* =  Header
	/*-------------------------------------------------*/
	#logo {
		padding: 30px 0 12px 0;
	}

	header nav {
		padding: 20px 20px 5px 20px;
		text-align: center;
	}

	header nav li {
		padding-right: 17px;
	}

	header nav li a {
		font-size: 12px;
	}

	#social-media {
		margin-top: 52px;
	}

	#social-media li {
		margin-left: 8px;
	}

	#social-media a {
		height: 12px;
	}

	/*-------------------------------------------------*/
	/* =  Home - Flexslider
	/*-------------------------------------------------*/
	#slider-container {
	 	width: 438px;
	 	height: 183px;
	}

	#slider-bg {
		background: url(img/responsive/landscape/slider-bg.png) no-repeat;
	}

	#slider-bg:after {
		content: '';
		border: 63px solid transparent;
	}

	.flex-caption {
		display: none;
	}

	/* -- Direction Nav -- */
	.flex-direction-nav {
		bottom: 3px;
		right: 3px;
		width: 26px;
		height: 16px;
		background: url(img/responsive/landscape/direction-nav-bg.png) no-repeat center center;
		padding: 23px 17px;
	}

	.flex-direction-nav li a.prev {
		width: 10px;
		height: 19px;
		background: url(img/responsive/landscape/prev-nav.png) no-repeat;
	}

	.flex-direction-nav li a.prev:hover {
		background: url(img/responsive/landscape/prev-nav-hover.png) no-repeat;
	}

	.flex-direction-nav li a.next {
		width: 10px;
		height: 19px;
		background: url(img/responsive/landscape/next-nav.png) no-repeat;
	}

	.flex-direction-nav li a.next:hover {
		background: url(img/responsive/landscape/next-nav-hover.png) no-repeat;
	}


	/* -- Control Nav -- */
	.flex-control-nav {
		right: 128px;
		bottom: 6px;
	}

	/*-------------------------------------------------*/
	/* =  About
	/*-------------------------------------------------*/
	.about aside {
		width: 398px;
		padding: 20px;
		border-right: none;
	}

	.about #photo:after {
		left: 110px;
	}

	#skills {
		margin-top: 20px;
	}

	#skills h3 {
		text-align: center;
	}

	#skills h3 span {
		padding: 0px 10px;
	}

	#skills ul {
		margin-right: 0px;
	}

	.about .about-content {
		padding: 0px 20px 20px 20px;
		width: 398px;
		border-left: none;
		left: 0px;
	}

	blockquote {
		margin: 15px 0px;
		line-height: 20px;
		font-size: 15px;
	}

	/*-------------------------------------------------*/
	/* =  Portfolio
	/*-------------------------------------------------*/
	#portfolio-filter {
		height: 36px;
	}

	#portfolio-filter li {
		margin-left: 15px;
		padding: 13px 0px;
	}

	#portfolio-filter li a {
		font-size: 11px;
	}

	#portfolio-list {
		width: 436px;
	}

	#portfolio-list li {
		width: 195px;
		height: 113px;
	}

	/*-------------------------------------------------*/
	/* =  Contact
	/*-------------------------------------------------*/
	#contact .left {
		width: 398px;
		padding: 10px 20px 20px 20px;
	}
	#contact textarea {
		width: 374px;
		max-width: 374px;
	}

	#map-container {
		width: 398px;
		margin: 0px 20px 20px 20px;
	}

	/*-------------------------------------------------*/
	/* =  Blog
	/*-------------------------------------------------*/
	.post .postText {
		width: 398px;
		margin-left: 0px;
		border-left: none;
	}

	.post .postText > a:not(.read-more) {
		display: none;
	}

	.post-meta {
		display: none;
	}

	.load-more {
		width: 438px;
		border-left: none;
	}

	/*-------------------------------------------------*/
	/* =  SinglePost
	/*-------------------------------------------------*/
	.post-image img {
		width: 398px;
	}

	.comments-container {
		width: 398px;
	}

	#reply textarea {
		min-width: 376px;
		max-width: 376px;
	}

	#reply input[type="submit"] {
		margin-right: 0px;
	}
}


/*-------------------------------------------------*/
/* =  Smartphones
/*-------------------------------------------------*/
@media screen and (max-width: 437px) {
	#contact h2,
	.about h2 {
		margin: 14px 0px 2px 0px;
	}

	#contact h2:before,
	.about h2:before {
		content: '';
		border-bottom: none;
	}

	p {
		font-size: 12px;
		line-height: 20px;
	}

	#container {
		width: 300px;
	}

	#loading-container {
		margin-left: -150px;
		top: 136px;
		width: 300px;
	}
	/*-------------------------------------------------*/
	/* =  Header
	/*-------------------------------------------------*/
	#logo {
		padding: 30px 0 12px 0;
	}

	header nav {
		padding: 16px 16px 1px 16px;
		margin-top: 15px;
		text-align: center;
	}

	header nav li {
		padding-right: 20px;
	}

	header nav li a {
		font-size: 12px;
	}

	#social-media {
		margin-top: 52px;
	}

	#social-media li {
		margin-left: 8px;
	}

	#social-media a {
		height: 12px;
	}

	/*-------------------------------------------------*/
	/* =  Content
	/*-------------------------------------------------*/
	#content {
		/*margin-top: 15px;*/
	}

	#slider-container {
	 	width: 300px;
	 	height: 125px;
	}

	#slider-bg {
		background: url(img/responsive/landscape/slider-bg.png) no-repeat;
		display: none;
	}

	.flex-caption {
		display: none;
	}

	/* -- Direction Nav -- */
	.flex-direction-nav {
		display: none;
	}

	/* -- Control Nav -- */
	.flex-control-nav {
		display: none;
	}

	/*-------------------------------------------------*/
	/* =  About
	/*-------------------------------------------------*/
	.about aside {
		width: 260px;
		padding: 20px;
		border-right: none;
	}

	.about #photo:after {
		left: 40px;
	}

	#skills h3 {
		text-align: center;
	}

	#skills h3 span {
		padding: 0px 10px;
	}

	#skills ul {
		margin-right: 0px;
	}

	.about .about-content {
		padding: 0px 20px 20px 20px;
		width: 260px;
		border-left: none;
		left: 0px;
	}

	blockquote {
		margin: 15px 0px;
		line-height: 20px;
		font-size: 15px;
	}

	/*-------------------------------------------------*/
	/* =  Portfolio
	/*-------------------------------------------------*/
	#portfolio-filter {
		height: auto;
		padding-left: 0px;
		padding-bottom: 5px;
		overflow: hidden;
	}

	#portfolio-filter li {
		margin-left: 0px;
		float: none;
		display: block;
		padding: 8px 0px;
	}

	#portfolio-filter li.back {
		display: none;
	}

	#portfolio-filter li a {
		display: block;
		text-align: center;
		font-size: 12px;
	}

	#portfolio-filter li a.active {
		color: #619d21;
	}

	#portfolio-list {
		width: 298px;
	}

	#portfolio-list li {
		width: 125px;
		height: 72px;
	}

	/*-------------------------------------------------*/
	/* =  Contact
	/*-------------------------------------------------*/
	#contact .left {
		width: 260px;
		padding: 10px 20px 20px 20px;
	}

	#contact textarea {
		width: 236px;
		max-width: 236px;
	}

	#map-container {
		width: 260px;
		height: 360px;
		margin: 0px 20px 20px 20px;
	}

	/*-------------------------------------------------*/
	/* =  Footer
	/*-------------------------------------------------*/
	footer {
		margin-top: 5px;
	}

	footer p {
		line-height: 20px;
	}

	/*-------------------------------------------------*/
	/* =  Blog
	/*-------------------------------------------------*/
	.post .postText {
		width: 260px;
		margin-left: 0px;
		border-left: none;
	}

	.post:not(.single) .post-content {
		max-height: 170px;
	}

	.post .postText > a:not(.read-more) {
		display: none;
	}

	.post-meta {
		display: none;
	}

	.load-more {
		width: 300px;
		border-left: none;
	}

	/*-------------------------------------------------*/
	/* =  SinglePost
	/*-------------------------------------------------*/
	.post-image img {
		width: 260px;
	}

	.comments-container {
		width: 260px;
	}

	#reply input[type="text"] {
		width: 238px;
	}

	#reply textarea {
		min-width: 238px;
		max-width: 238px;
	}

	#reply input[type="submit"] {
		margin-right: 0px;
	}
}