/*=================================================================================*/
/* CSS definations for "OVARI"
/*=================================================================================*/

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

INDEX:

0. RESET

1. Typography

2. Header
	2.1 General
	2.2 Social Icons
	2.3 Primary Navigation

3. Body
	3.1 General
	3.2 Tagline
	3.3 Page Header

4. Portfolio
	4.1 Main Grid
	4.2 Single - Portfolio Info
	4.3 Single - Portfolio Media
	4.4 Portfolio Navigation

5. Blog
	5.1 Main List
	5.2 Post - Gallery Format
	5.3 Blog Paginition
	5.4 Single - Meta

6. Comments
	6.1 General
	6.2 Comments List
	6.3 Comments Meta
	6.4 Comments Body
	6.5 Comments Children

7. Forms
	7.1 General
	7.2 Labels
	7.3 Placeholder
	7.4 Search Form

8. Sidebar
	8.1 General
	8.2 Widget - Links List
	8.3 Widget - Tags
	8.4 Widget - Flickr Images

9. Off-Canvas Sidebar
	9.1 Overlay
	9.2 Widgets
	9.3 Handler

10. Other Templates
	10.1 Clients
	10.2 Services

11. Footer

12. Miscellaneous
	12.1 Thumbnail Overlay
	12.2 Back To Top
	12.3 Social Profiles
	12.4 More Link

13. Visual Enhancements
	13.1 CSS3 Shadow
	13.2 Stroke Adjustment
	13.3 CSS3 Transitions


/*=================================================================================*/
/* 0. 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;
}

/* 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;
}


/*=================================================================================*/
/* 1. TYPOGRAPHY
/*=================================================================================*/


/*--- General ---*/
body {
    font-family: 'Open Sans';
}
h1, h2, h3, h4, h5, h6,
#primary-nav > ul > li > a
{
    font-family: 'Merriweather';
}

body {
    font-size: 14px;
    line-height: 21px; /* (line height = magic number) = (base font size) * 1.5 */
}
p {
    font-size: 1em; /* 1em = base font size = 14px */
    margin-top: 0;
    margin-bottom: 21px;
}
p + p {
    clear: both;
}
a {
    color: #ef6250;
    border-bottom: 1px solid #c9cbd0;
}
a:hover {
    color: #ef6250;
    border-bottom: 1px solid #757575;
    text-decoration: none !important;
}


/*--- Headings ---*/
h1, h2, h3, h4, h5, h6 {
    color: #262626;
	font-weight: bold;
    margin: 0 0 21px 0;
    letter-spacing: -1px;
}

h1 {
	font-size: 24px;
    line-height: 28px; /* (magic number) ÷ (font size) = (line height) */
}
aside h1{
	color: #999;
}
h2 {
	font-size: 22px; /* (font size) px ÷ (base font size) = (font size) em */
    line-height: 24px;
}
h3 {
    font-size: 20px;
    line-height: 22px;
}
h4 {
    font-size: 18px;
    line-height: 20px;
}
h5 {
    font-size: 16px;
    line-height: 18px;
}
h6 {
    font-size: 16px;
    line-height: 18px;
}


/*--- Lists ---*/
ul, ol, dl {
  margin-bottom: 5px;
}

ul {
  list-style: square inside;
}
ol {
    list-style: decimal inside;
}

ul ul,
ol ol {
  margin: 0 0 0 21px;
}

dt {
    font-weight: bold;
}


/*--- Table ---*/
table, th, td {
    border: 1px solid rgba(0, 0, 0, 0.1);
}
table {
    border-collapse: separate;
    margin-bottom: 21px;
    width: 100%;
    border-right: 0;
    border-bottom: 0;
}
th, td {
    font-weight: normal;
    text-align: center;
}
th {
    border-width: 0 1px 1px 0;
    font-weight: bold;
    padding: 10px;
}
td {
    border-width: 0 1px 1px 0;
    padding: 5px;
}
th {
    background: #f0f0f0;
    color: #757575;
}


/*--- Block Quote ---*/
blockquote {
    font-family: 'Merriweather', Georgia, 'Times New Roman';
    font-style: italic;
    color: #96999d;
    border-left: 1px solid #e0e0e0;
    padding: 0 40px;
    margin: 40px 40px 40px 0;
}
blockquote p {
    font-size: 14px;
    font-weight: 400;
    line-height: 26px;
}
blockquote cite {
    font-family: 'Lekton', Georgia, 'Times New Roman';
    font-style: normal;
    padding-top: 5px;
    display: inline-block;
    font-size: 14px;
    color: #bfbfbf;
}
cite a {
  color: #464646;
}


/*--- Others ---*/
hr {
    padding: 0;
	margin: 42px 0;    
    border: none;
    border-top: 1px solid #d8d8d8;
    text-align: center;
    clear: both;
}

code, kbd, pre, samp {
    font-family: monospace, serif;
}
pre {
    white-space: pre-wrap;
}

.image-half, .video-half {
    display: inline-block;
    float: left;
    margin-right: 1%;
    width: 49%;
}


/*--- Dropcap ---*/
.dropcap {
    font-family: 'Droid Serif', Georgia, 'Times New Roman';
    font-size: 80px;
    float: left;
    color: #ef6250;
    padding: 25px 15px 30px 0;
    line-height: 14px;
}


/*=================================================================================*/
/* 2. HEADER
/*=================================================================================*/


/*--- 2.1 General ---*/
#site-header {
	margin-top: 105px;
}
#primary-nav {
	position: relative;
	height: 41px;
}
#site-logo {
    font-family: "Josefin Slab";
    z-index: 1000;
}
#site-logo a {
    color: #262626;
    font-size: 34px;
    font-weight: 400;
	 border-bottom: 0;
}
#site-logo a:hover {
    color: #ef6250;
}


/*--- 2.2 Social Icons ---*/
#site-header .social ul {
	border-bottom: 1px solid #d8d8d8;
}
#site-header .social ul {
	padding-bottom: 14px;
	padding-top: 3px;
}


/*--- 2.3 Primary Navigation ---*/
#primary-nav								{ /*border-bottom: 1px solid #d8d8d8; */}

/* 
	LEVEL ONE
*/
#primary-nav > ul							{ position: absolute; top: 0; right: 0; list-style: none; margin: 4px 0 0 0; }
#primary-nav > ul > li						{ float: left; zoom: 1; margin-right: 50px;}
#primary-nav > ul > li > a					{ font-size: 18px; letter-spacing: -0.5px; font-weight: bold; display: block; padding-bottom: 14px; color: #222; text-decoration: none; border-bottom: 0; }
#primary-nav > ul > li:last-child > a		{ border-right: none; } /* Doesn't work in IE */
#primary-nav > ul > li > a:hover,
#primary-nav > ul > li.active > a			{ color: #ef6250; -webkit-text-stroke: 0.8px; }
#primary-nav > ul > > li > a:active			{ color: #ffa500; -webkit-text-stroke: 0.8px; }
#primary-nav > ul > li.hover,
#primary-nav > ul > li:hover				{ position: relative; }
#primary-nav > ul > li.hover > a			{ color: #ef6250; }

/* 
	LEVEL TWO
*/
#primary-nav ul ul							{ list-style: none; width: 200px; visibility: hidden; background: #26262c; margin: 0; padding: 20px 25px; position: absolute; top: 102%; left: 0; border-radius: 0 0 4px 4px; z-index: 100; }
#primary-nav ul ul li						{ font-family: 'Open Sans'; font-style: normal; font-size: 15px; float: none; }
									  
/* IE 6 & 7 Needs Inline Block */
#primary-nav ul ul li a						{ color: #b9b9b9; font-weight: normal; line-height: 33px; width: 100%; display: inline-block;  text-decoration: none; border-bottom: 0; -webkit-text-stroke: 0.4px; } 
#primary-nav ul ul li a:hover				{ color: #fff; } 

/* 
	LEVEL THREE
*/
#primary-nav ul ul ul						{ left: 100%; top: 0; }
#primary-nav ul li:hover > ul				{ visibility: visible; }

/* 
	Magic Line
*/
#primary-nav > ul > li.active				{ border-bottom: 2px solid #ef6250; }


/*=================================================================================*/
/* 3. BODY
/*=================================================================================*/


/*--- 3.1 General ---*/
#site-body {
	margin-top: 72px;
}
#site-body img {
	max-width: 100%;
}


/*--- 3.2 Tagline ---*/
#site-body #tagline h1 {
	font-size: 26px;
	line-height: 36px;
	font-style: normal;
	letter-spacing: -1.5px;	
}
#site-body #tagline p {
	margin-bottom: 11px;
}


/*--- 3.3 Page Header ---*/
.page-header {
	border-bottom: 1px solid #d8d8d8;
	margin-bottom: 30px;
}
.page-header h2 {
	background: #d8d8d8;
	color: #757575;
	letter-spacing: -1px;

	display: block;
	margin-bottom: 5px;

	text-align: center;

	width: 100%;
	height: 250px;
	line-height: 250px;
	font-size: 36px;
}

.col-md-4 h3 {
	margin: 36px 0 10px 0;
}
.col-md-4 h3:first-child {
	margin-top: 0;
}


/*=================================================================================*/
/* 4. PORTFOLIO
/*=================================================================================*/


/*--- 4.1 Main Grid ---*/
#portfolio-grid .portfolio {
	margin-bottom: 30px;
}
#portfolio-grid .portfolio .inner {
	background: #fff;
	background:none;
	overflow: hidden;
}


#portfolio-grid .portfolio .thumbnail {
    border-bottom: 0;
}
#portfolio-grid .portfolio .thumbnail img {
	width: 100%;
	height: auto;
	overflow: hidden;
}

#portfolio-grid .portfolio .thumbnail:hover img {
	width: 105%;
	height: auto;
	overflow: hidden;
}


#portfolio-grid .portfolio .header {
	padding: 20px 8px 18px;
	text-align: center;
	position: relative;
	bottom:0;
    z-index: 90;
	background: rgba(255, 255, 255, 0.93);
	background:linear-gradient(rgba(255, 255, 255, 0.75),rgba(255, 255, 255, 0.95) 50%);
	background: rgba(255,255,255,0.85);
	background:#fafafa;
	width: 100%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	margin-top:0px;
}
#portfolio-grid .portfolio .title,
#portfolio-grid .portfolio .title a
{
	margin-bottom: 8px;
	font-style: normal;
	letter-spacing: -1px;
	color: #262626;
	border-bottom: 0;
	flex: 1 0 100%;
}
#portfolio-grid .portfolio a:hover  .title  {
	color: #262626;
	text-decoration: none;
}
#portfolio-grid .portfolio .tags {
	margin-top: 0px;
	color: #868686;
    flex: 1 0 100%;
    line-height: 1.35;
	font-weight: 400;
	font-size:15px;
	letter-spacing: -0.1px;
	white-space: nowrap;
}


/*--- 4.2 Single - Portfolio Info ---*/
.single-portfolio .desc {
	margin-top: 21px;
}
.single-portfolio .desc h2 {
	font-size: 26px;
	font-style: normal;
}
.single-portfolio .meta {
	margin-top: 40px;
}
.single-portfolio .meta > div:first-child {
	border-top: 1px solid #d8d8d8;
}
.single-portfolio .meta > div {
	border-bottom: 1px solid #d8d8d8;
}
.single-portfolio .meta h4 {
	font-size: 16px;
	display: inline-block;
	font-weight: bold;
	width: 60px;
}
.single-portfolio .meta p {
	margin: 0;
	display: inline-block;
}
.single-portfolio .meta > div {
	padding: 15px 0;
}
.single-portfolio .meta h4,
.single-portfolio .meta > div,
.single-portfolio .meta p
{
	margin-bottom: 0;
}
.single-portfolio .more-link {
	margin-top: 40px;
}


/*--- 4.3 Single - Portfolio Media ---*/
#portfolio-media{
	margin: 0 24px;
}
#portfolio-media .media {
	margin-bottom: 30px;
}
#portfolio-media .image-stack .image {
    clear: left;
}
#portfolio-media .image-stack .image, #portfolio-media .image-stack .image-half,
#portfolio-media .image-stack .image, #portfolio-media .image-stack .video-half {
	overflow: hidden;
	margin-bottom: 30px;
	background: #fff;
}
#portfolio-media .image-stack .image a, #portfolio-media .image-stack .image-half a {
	border-bottom: 0;
}
#portfolio-media .image-stack .image img, #portfolio-media .image-stack .image-half img,
#portfolio-media .image-stack .image img, #portfolio-media .image-stack .video-half video {
	width: 100%;
}
#portfolio-media .image-stack .image .caption, #portfolio-media .image-stack .image-half .caption,
#portfolio-media .image-stack .image .caption, #portfolio-media .image-stack .video-half .caption {
	font-size: 14px;
	line-height: 22px;
	padding: 20px 30px;
	border: none;
	color:#ddd;
	background-color:#333;
}


#portfolio-media .caption strong{
	color:#111;
}


#portfolio-media .caption ul li{
	list-style-type: circle;
	list-style-position: inside;
	
}

.caption i{
	text-transform: uppercase;
	font-size: 11px;
	color: #888;
	display: block;
}


/*--- 4.4 Portfolio Navigation ---*/
.portfolio-nav {
	padding: 15px 0 0 0;
}

.more-projects{
	clear: left;
	padding: 15px 0 0 0;
}

.more-projects > div{
	margin-bottom: 25px;
}

.more-projects div a{
	color:#444;
	display: block;
	background: #fff;
	text-align: center;
	padding: 0px;
	border-bottom: 1px solid #dadada;
}

.more-projects div a:hover{
	color:#a65050;
}

.more-projects h4 {
    margin:25px 14px 35px;
}

.more-projects .viewall{
	font-weight: normal;
	border: none;
	text-decoration: none;
	font-size: 13px;
	margin: 0 15px;
}

.more-projects div a img {
    margin-bottom: -3px;
}

.portfolio-nav a,
.portfolio-nav a span
{
	color: #b7b7b7;
	text-transform: uppercase;
	text-decoration: none;
	vertical-align: top;
	line-height: 26px;
    border-bottom: 0;
}
.portfolio-nav a i {
	font-size: 26px;
	padding-right: 10px;
}
.portfolio-nav a:hover,
.portfolio-nav a:hover span
{
	color: #757575;
}

.load-more a,
.load-more a span
{
	line-height: 28px;
    border-bottom: 0;
}
.load-more a i {
	font-size: 28px;
}


/*=================================================================================*/
/* 5. BLOG
/*=================================================================================*/


/*--- 5.1 Main List ---*/
#blog .post {
	background: #fff;
	overflow: hidden;
	margin-bottom: 30px;
}
#blog .post .media img {
	width: 100%;
}
#blog .post .content .inner {
	padding: 42px;
}
#blog .post .content .inner p:last-child {
	margin-bottom: 0;
}
#blog .post .date {
	display: inline-block;
	font-size: 12px;
	text-transform: uppercase;
	padding: 4px 10px;
	margin-bottom: 18px;
	background: #ebeaea;
	color: #b7b7b7;
}

#blog .post .title,
#blog .post .title a
{
	color: #262626;
	font-size: 28px;
	font-style: normal;
	letter-spacing: -1px;
	line-height: 42px;
    border-bottom: 0;
}
#blog .post .title a:hover {
	color: #ef6250;
	text-decoration: none;
}
#blog .post .title {
    margin-bottom: 13px;
}

#blog .post .desc {
	margin-bottom: 0;
}
#blog .post .more-link {
	margin-top: 26px;
}


/*--- 5.2 Post - Gallery Format ---*/
#blog .post.format-gallery .media ul {
	list-style: none;
	margin: 0;
	padding: 0;
}


/*--- 5.3 Blog Paginition ---*/
#paginition {
	margin-top: 37px;
}
#paginition ul {
	list-style: none;
	padding: 0;
	margin-bottom: 0;
}
#paginition ul li {
	display: inline-block;
	margin-right: 20px;
}
#paginition ul li,
#paginition ul li a
{
	font-size: 16px;
	color: #757575;
    border-bottom: 0;
}
#paginition ul li a:hover {
	color: #262626;
	text-decoration: none;
}
#paginition ul li span.current {
	color: #262626;
}

/*--- 5.4 Single - Meta ---*/
#blog .post .meta {
	border-top: 1px solid #e5e5e5;
	padding: 21px 42px;
	margin: 0;
}
#blog .post .meta a {
	color: #757575;
	text-decoration: none;
}
#blog .post .meta p {
	padding-bottom: 0;
	margin-bottom: 0;
}
#blog .post .meta .author {
	display: inline-block;
	color: #b7b7b7;
	line-height: 28px;
}
#blog .post .meta .tags {
	display: inline-block;
	float: right;
}
#blog .post .meta .tags a {
	display: inline-block;
	font-size: 13px;
	padding: 4px 10px;
	margin-left: 10px;

	background: #f0f0f0;
	color: #b7b7b7;
	border-bottom: 0;
}
#blog .post .meta .tags a:hover {
	background: #ef6250;
	color: #fff;
}


/*=================================================================================*/
/* 6. COMMENTS
/*=================================================================================*/


/*--- 6.1 General ---*/
.comments {
	margin-top: 80px;
}
.comments > h3 {
	color: #262626;
	font-size: 24px;
	font-style: normal;
	margin-bottom: 42px;
	letter-spacing: -1px;
}

/*--- 6.2 Comments List ---*/
.comments-list {
	list-style: none;
	padding: 0;
	margin-bottom: 53px;
}
.comments-list li {
	margin-bottom: 30px;
}
.comments-list li .pull-left {
	margin-right: 30px;
	border-bottom: 0;
}

/*--- 6.3 Comments Meta ---*/
.comments-list li .meta {
	margin-bottom: 10px;
}
.comments-list li .meta .author {
	color: #262626;
	font-size: 17px;
}
.comments-list li .meta .time {
	color: #b7b7b7;
	font-size: 12px;
	padding-left: 15px;
}
.comments-list li .meta .reply a {
	color: #262626;
	font-family: "FontAwesome";
	font-size: 12px;
	padding-left: 15px;
	display: none;
	line-height: 18px;
	border-bottom: 0;
}
.comments-list li .body:hover .meta .reply a {
	display: inline-block;
}
.comments-list li .body:hover .meta .reply a:hover {
	color: #ef6250;
}

/*--- 6.4 Comments Body ---*/
.comments-list li .body {
	overflow: hidden;
	zoom: 1;
}


/*--- 6.5 Comments Children ---*/
.comments-list li .children {
	border-left: 1px solid #d8d8d8;
	list-style: none;
	padding-top: 15px;
	padding-left: 0;
	margin-top: 15px;
}
.comments-list li .children li {
	background: url('../img/bright_cmnt_h_line.png') no-repeat left 32px;
	padding-left: 60px;
}


/*=================================================================================*/
/* 7. FORMS
/*=================================================================================*/


/*--- 7.1 General ---*/
form p {
	margin-bottom: 20px;
	padding-bottom: 0 !important;
}
form p:first-child {
	margin-top: 0;
}
form p:nth-last-of-type(2) {
	margin-bottom: 10px;
}
input, textarea, select, button {
	font-size: 14px;
}
input, textarea, select {
	color: #757575;
	background: #e6e6e6;

	border-radius: 2px;

	border: 0;
	outline: 0 none;

	line-height: 20px;

	padding: 11px 15px;

	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box; 
}
input:focus, textarea:focus {
	background-color: #fff;
}
input.error, textarea.error {
	border: 1px solid #f00;
}
input[type="text"], input[type="email"],
input[type="url"], input[type="tel"], input[type="file"], select, textarea { 
	width: 100%;
}


/*--- 7.2 Labels ---*/
label {
	font-size: 14px;
	font-weight: bold;
	margin-bottom: 10px;
}
label.error {
	display: none !important;
}
label span {
	color: #ef6250;
}


/*--- 7.3 Placeholder - Keep Seperate ---*/
::-webkit-input-placeholder { /* WebKit browsers */
	font-size: 14px;
	font-style: italic;
	font-weight: 200;
	color: #A28D8A;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	font-size: 14px;
	font-style: italic;
	font-weight: 200;
	color: #A28D8A;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
	font-size: 14px;
	font-style: italic;
	font-weight: 200;
	color: #A28D8A;  
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
	font-size: 14px;
	font-style: italic;
	font-weight: 200;
	color: #A28D8A;
}
.placeholder,
.placeholderFocus
{
	font-size: 14px;
	font-style: italic;
	font-weight: 200;
	color: #A28D8A;
}


/*--- 7.4 Search Form ---*/
#search-form {
	position: relative;
}
#search-form input {
	width: 100%;
	background-color: #fff;
	border-radius: 25px;
	outline: 0;
	border: 0;
	line-height: 20px;
	padding: 10px 45px 10px 20px;
	font-size: 14px;
}
#search-form button {
	position: absolute;
	right: 13px;
	bottom: 10px;
	background: transparent;
	border: 0;
	outline: 0;
	font-size: 15px;
	color: #757575;
}
#search-form button:hover {
	color: #757575;
}

#search-form ::-webkit-input-placeholder { /* WebKit browsers */
	color: #757575;
}
#search-form :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color: #757575;
}
#search-form ::-moz-placeholder { /* Mozilla Firefox 19+ */
	color: #757575;
}
#search-form :-ms-input-placeholder { /* Internet Explorer 10+ */
	color: #757575;
}


/*=================================================================================*/
/* 8. SIDEBAR
/*=================================================================================*/


/*--- 8.1 General ---*/
#sidebar .widget {
	margin-bottom: 35px;
}
#sidebar .widget h3 {
	margin-bottom: 13px;
	letter-spacing: -1px;

	font-style: normal;
	font-size: 19px;
}
#sidebar .widget select {
	width: 100%;
}


/*--- 8.2 Widget - Links List ---*/
.widget ul {
	margin-left: 0;
	padding-left: 0;
	list-style: none;
}
.widget ul li,
.widget ul li a
{
	color: #757575;
	font-size: 14px;
	line-height: 28px;
    border-bottom: 0;
}
.widget ul li a:hover {
	color: #ef6250;
	text-decoration: none;
}
.widget ul ul {
	padding-left: 15px;
	border-left: 3px solid #333;
}


/*--- 8.3 Widget - Tags ---*/
.widget_tag_cloud h3 {
	margin-bottom: 24px !important;
}
.widget_tag_cloud a {
	display: inline-block;
	font-size: 13px;
	line-height: 28px;
	padding: 3px 12px;
	margin-right: 15px;
	margin-bottom: 13px;

	background: #e6e6e6;
	color: #757575;

	border-radius: 3px;
    border-bottom: 0;
	text-decoration: none;

}
.widget_tag_cloud a:hover {
	background: #ef6250;
	color: #fff !important;
}


/*--- 8.4 Widget - Flickr Images ---*/
.widget_flickr ul {
	padding-left: 0;
	margin-top: 25px;
}
.widget_flickr ul li {
	list-style: none;
	display: inline-block;
	margin: 0 4px 8px 0;
}
.widget_flickr ul li,
.widget_flickr ul li img {
	border-radius: 2px;
	width: 75px;
}
.widget_flickr ul li:nth-child(3n+3) {
	margin-right: 0;
}
.widget_flickr ul li:nth-last-child(-n+3) {
	margin-bottom: 0;
}
.widget_flickr ul li,
.widget_flickr ul li a {
	display: inline-block;
	height: 75px;
}
.widget_flickr ul li a:hover {
	opacity: 0.6;
}


/*=================================================================================*/
/* 9. OFF-CANVAS SIDEBAR
/*=================================================================================*/


/*--- 9.1 Overlay ---*/
#sb-site {
    background-color: #eeeeef !important;
}
#sb-site .site-overlay {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 100;
    display: none;
}
html.sb-active #sb-site .site-overlay {
    display: block;
}


/*--- 9.2 Widgets ---*/
.sb-slidebar {
    background: #191918 !important;
    padding: 60px 30px !important;
}
.sb-slidebar .widget {
    border-bottom: 1px solid #242424;
    padding-bottom: 60px;
    margin-bottom: 60px;
}
.sb-slidebar .widget:last-child {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}
.sb-slidebar .widget a {
    color: #b2b2b1;
}
.sb-slidebar .widget ul {
    margin-bottom: 0;
}
.sb-slidebar .widget ul li,
.sb-slidebar .widget ul li a
{
    font-size: 15px;
    line-height: 32px;
}
.sb-slidebar .widget h3 {
    color: #fff !important;
    margin-bottom: 15px;
    letter-spacing: -1px;
    font-style: normal;
    font-size: 20px;
    -webkit-text-stroke: 0;
}


/*--- 9.3 Handler ---*/
.sb-sidebar-toggle,
.sb-sidebar-toggle:hover
{
    position: absolute;
    top: 0;
    right: 0;

    display: inline-block;
    width: 48px; 
    height: 48px;

    border-bottom: 0; 
    background: #ffff84; 

    z-index: 400;
}
.sb-sidebar-toggle i {
    position: absolute;
    top: 14px;
    right: 14px;

    color: #222;
    font-size: 20px;

}

.sb-sidebar-toggle i.fa-times,
html.sb-active .sb-sidebar-toggle i.fa-navicon
{
    display: none;
}
html.sb-active .sb-sidebar-toggle i.fa-times {
    display: block;
}


/*=================================================================================*/
/* 10. OTHER TEMPLATES
/*=================================================================================*/


/*--- 10.1 Clients ---*/
#clients-grid .client .inner {
	border-bottom: 1px solid #d8d8d8;
	margin-bottom: 45px;
}
#clients-grid .client .logo  {
	background: #d8d8d8;

	width: 100%;
	height: 150px;
	line-height: 150px;

	display: block;
	margin-bottom: 5px;

	text-align: center;

	overflow: hidden;
    border-bottom: 0;
}
#clients-grid .client .logo img  {
	max-width: 100%;
	max-height: 100%;
}


/*--- 10.2 Services ---*/
#services-grid .service  {
	overflow: hidden;
	margin-bottom: 45px;
}

#services-grid .service .icon {
	background: #d8d8d8;

	display: block;
	width: 100%;
	height: 150px;

	margin-bottom: 5px;

	text-align: center;
    border-bottom: 0;
}
#services-grid .service .icon i {
	line-height: 150px;
	color: #888888;
	font-size: 52px;
}

#services-grid .service .summary {
	border-top: 1px solid #d8d8d8;
	padding-top: 25px;
}
#services-grid .service .title,
#services-grid .service .title a
{
	color: #262626;
	margin-bottom: 16px;
	font-style: normal;
	letter-spacing: -1px;
    border-bottom: 0;
}
#services-grid .service .title a:hover {
	color: #ef6250;
	text-decoration: none;
}


/*=================================================================================*/
/* 11. FOOTER
/*=================================================================================*/


/*--- 11.1 General ---*/
#site-footer {
	margin:42px -15px;
}
#site-footer .inner {
	padding-top: 16px;
	border-top: 1px solid #d8d8d8;
}


/*=================================================================================*/
/* 12. MISCELLANEOUS
/*=================================================================================*/


/*--- 12.1 Thumbnail Overlay ---*/
.thumbnail {
    position: relative;
    display: block;
    overflow: hidden;
}
.thumbnail .overlay,
.thumbnail .overlay span
{
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	margin: auto;
}
.thumbnail .overlay {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    color: #fff;
	background: rgba(0, 0, 0, 0.1);
	background: linear-gradient(rgba(255, 255, 255, 0.3),rgba(0, 0, 0, 0.0) 35%);
	background:none;
    text-align: center;
    opacity: 0;    
}
.thumbnail:hover .overlay {
    opacity: 100;
}
.thumbnail:hover .overlay .icon {
    display: inline-block;
    vertical-align: middle;  /* vertical alignment of the inline element */
    width: 65px; 
    height: 60px;
    background: url('../img/bright_sprites.png') no-repeat;
	background-position: -4px -40px;
	display: none;
}
.overlay,
.thumbnail:hover .overlay
{
    -webkit-transition: opacity 300ms ease-in-out;
    -moz-transition: opacity 300ms ease-in-out;
    -ms-transition: opacity 300ms ease-in-out;
    -o-transition: opacity 300ms ease-in-out;
    transition: opacity 300ms ease-in-out;
}


/*--- 12.2 Back To Top ---*/
#back-to-top {
    display: none;
    position: fixed;
    bottom: 60px;
    left: 110px;
}
#back-to-top .handler {
    display: inline-block;
    width: 65px; 
    height: 34px;

    background: url('../img/bright_sprites.png') no-repeat;
    opacity: 0.5;
    border-bottom: 0;
}
#back-to-top .handler:hover {
    opacity: 1;
}


/*--- 12.3 Social Profiles ---*/
.social ul {
    list-style: none;
    text-align: right;
}
.social ul li {
    margin-right: 5px;
    display: inline-block;
}
.social ul li:last-child {
    margin-right: 0;
}
.social ul li a {
    font-size: 20px;
    color: #757575;
    border-bottom: 0;
}
.social ul li a:hover {
    color: #ef6250
}


/*--- 12.4 More Link ---*/
.more-link, input[type="submit"] {
    border: 2px solid #262626;
    background: none;
    color: #111;    
    padding: 10px 14px 10px 14px;
    border-radius: 6px;
    display: inline-block;
    margin-top: 20px;
    line-height: 16px;
    display: inline-block;
}
.more-link:hover, input[type="submit"]:hover {
    background: #ef6250;
    border-color: #ef6250;
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}


/*=================================================================================*/
/* 13. VISUAL ENHANCEMENTS
/*=================================================================================*/


/*--- 13.1 CSS3 Shadow ---*/

#content,
#blog .post,
#portfolio-grid .portfolio .inner
{
    overflow: hidden;

    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
       -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);   
}


/* 13.2 Stroke Adjustment */
body {
	-webkit-text-stroke: 0.4px;
}
#site-body #tagline h1 {
	-webkit-text-stroke: 0.4px;
}
#primary-nav > ul > li > a  {
	-webkit-text-stroke: 0.3px;
}
#primary-nav ul li a:hover,
#primary-nav ul li.active a
{
	-webkit-text-stroke: 0.2px;
}
#portfolio-grid .portfolio .title {
	-webkit-text-stroke: 0.3px;
	white-space: nowrap;
}
#blog .post .title {
	-webkit-text-stroke: 0.8px;
}
#sidebar .widget h3 {
	-webkit-text-stroke: 0.3px;
}
.widget ul li a:hover {
	-webkit-text-stroke: 0.4px;
}


/* 13.3 CSS3 Transitions */
a, button, input {
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    transition: all 0.2s ease;    
}
#primary-nav a {
    -webkit-transition: none;
    -moz-transition: none;
    transition: none;    
}