/*
	Theme Name: fullfat_black_1
	Theme URI: http://www.fullfat.com
	Description: Full Fat Website.
	Author: Matt Storey
	Author URI: http://www.onioneye.com/
	License: GNU General Public License version 3.0
	License URI: http://www.gnu.org/licenses/gpl-3.0.html
	Version: 1.1.6
	
	Designed & Handcrafted by Onioneye 
*/

/*  T A B L E   O F   C O N T E N T S 
    ........................................................................................................................................
	
	1. Reset Defaults
	2. Grid
	3. Base Styles 
	4. Typography
	5. Headings
    	6. Links
    	7. Lists
  	8. Forms
  	9. Images
  	10. Other Elements
  	11. Sliders
  	12. Lightbox and Modal Window
  	13. Header
  	14. Main Navigation
  	15. Pages
  	16. Home Template
  	17. Blog
  	18. Portfolio
  	19. Widgets
  	20. Shortcodes
  	21. Comments
  	22. 404 Page
  	23. Footer
	24. Extra
  	
*/

     
    
/*  1. R E S E T   D E F A U L T S 
    ........................................................................................................................................ */
	
	html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, 
	kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, 
	tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, 
	video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
	article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }
	:focus { outline: none; }
	ol, ul { list-style: none inside none; }
	blockquote, q { quotes: none; }
	blockquote: before, blockquote: after, q: before, q: after { content: " "; content: none; }
	ins { background-color: #eff3f4; text-shadow: none; color: #465458; text-decoration: none; }	
	mark { background-color: #dbebef; text-shadow: none; color: #465458; font-weight: bold; }
	del { text-decoration: line-through; }
	abbr[title], dfn[title] { border-bottom: 1px dotted #000; cursor: help; }
	hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }
	table { border-collapse: collapse; border-spacing: 0; } 	/*- tables still need 'cellspacing="0"' in the markup ----------*/
	caption, th, td { text-align: left; font-weight: normal; }
	input, textarea, button { border: none; }
	input, select { vertical-align: middle; } 



/*  2. G R I D 
    ........................................................................................................................................ */
	 
	body { min-width: 1000px; width:100%; -webkit-text-size-adjust:100%; color:#9b9b9b;}
	.container_12 { margin-left: auto; margin-right: auto; width: 960px; }
	.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { display: inline; float: left; margin-left: 10px; margin-right: 10px; }
	.push_1, .pull_1, .push_2, .pull_2, .push_3, .pull_3, .push_4, .pull_4, .push_5, .pull_5, .push_6, .pull_6, .push_7, .pull_7, .push_8, .pull_8, .push_9, .pull_9, .push_10, .pull_10, .push_11, .pull_11 { position: relative; }
	.alpha { margin-left: 0 }
	.omega { margin-right: 0 }
	
	.container_12 .grid_1 { width: 60px }
	.container_12 .grid_2 { width:140px }
	.container_12 .grid_3 { width:220px }
	.container_12 .grid_4 { width:300px }
	.container_12 .grid_5 { width:380px }
	.container_12 .grid_6 { width:460px }
	.container_12 .grid_7 { width:540px }
	.container_12 .grid_8 { width:620px }
	.container_12 .grid_9 { width:700px }
	.container_12 .grid_10 { width:780px }
	.container_12 .grid_11 { width:860px }
	.container_12 .grid_12 { width:940px }
	
	.container_12 .prefix_1 { padding-left:80px }
	.container_12 .prefix_2 { padding-left:160px }
	.container_12 .prefix_3 { padding-left:240px }
	.container_12 .prefix_4 { padding-left:320px }
	.container_12 .prefix_5 { padding-left:400px }
	.container_12 .prefix_6 { padding-left:480px }
	.container_12 .prefix_7 { padding-left:560px }
	.container_12 .prefix_8 { padding-left:640px }
	.container_12 .prefix_9 { padding-left:720px }
	.container_12 .prefix_10 { padding-left:800px }
	.container_12 .prefix_11 { padding-left:880px }
	
	.container_12 .suffix_1 { padding-right:80px }
	.container_12 .suffix_2 { padding-right:160px }
	.container_12 .suffix_3 { padding-right:240px }
	.container_12 .suffix_4 { padding-right:320px }
	.container_12 .suffix_5 { padding-right:400px }
	.container_12 .suffix_6 { padding-right:480px }
	.container_12 .suffix_7 { padding-right:560px }
	.container_12 .suffix_8 { padding-right:640px }
	.container_12 .suffix_9 { padding-right:720px }
	.container_12 .suffix_10 { padding-right:800px }
	.container_12 .suffix_11 { padding-right:880px }
	
	.container_12 .push_1 { left:80px }
	.container_12 .push_2 { left:160px }
	.container_12 .push_3 { left:240px }
	.container_12 .push_4 { left:320px }
	.container_12 .push_5 { left:400px }
	.container_12 .push_6 { left:480px }
	.container_12 .push_7 { left:560px }
	.container_12 .push_8 { left:640px }
	.container_12 .push_9 { left:720px }
	.container_12 .push_10 { left:800px }
	.container_12 .push_11 { left:880px }
	
	.container_12 .pull_1 { left:-80px }
	.container_12 .pull_2 { left:-160px }
	.container_12 .pull_3 { left:-240px }
	.container_12 .pull_4 { left:-320px }
	.container_12 .pull_5 { left:-400px }
	.container_12 .pull_6 { left:-480px }
	.container_12 .pull_7 { left:-560px }
	.container_12 .pull_8 { left:-640px }
	.container_12 .pull_9 { left:-720px }
	.container_12 .pull_10 { left:-800px }
	.container_12 .pull_11 { left:-880px }
	
	.game_images { margin-right: 0; margin-left: 0;}
	.game_text { width:305px; margin-right: 10px; margin-left: 5px; float:left; margin-top: 20px;}
	.indent-by-5 { padding-left:5px; padding-right:5px; margin-top: 32px;}
	/*section.indent-by-5 a { color:#79ccf6 }*/
 	
 	
/*  3. B A S E   S T Y L E S
    ....................................................................................................................................... */
	
	html body { background: #231f20; color:#dfdfdf; }	
	html { overflow-y: scroll; /* always force a scrollbar in non-IE */ }
	body { overflow-y: hidden; /*margin-top: 7px; */}
	body:before { content: " "; display: block; position: absolute; z-index: 100; width: 100%; min-width:1000px; left: 0; top: 0; height: 7px; background: #231f20; } /* top border */
	#main-wrapper { padding: 10px 20px 0px; } 
	/*.boxshadow #main-wrapper { -webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.15); -moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.15); box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.15); }*/
	#main-wrapper { background: #231f20; }
	.borderradius #main-wrapper { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
	#secondary-wrapper { padding: 40px 0 20px; }
	
	/* self-clearing floats */
	.mod:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }	
	.clear { clear: both; }	
	
	/* text highlight/selection */
	::-moz-selection{ color: violet; background: pink; text-shadow: none; }
	::selection { color: violet; background: pink; text-shadow: none; } 
	
	/*  
	 * Non-semantic helper classes 
	 */
	.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; } /* for image replacement */

	.hidden { display: none; visibility: hidden; } 	/* Hide for both screenreaders and browsers: css-discuss.incutio.com/wiki/Screenreader_Visibility */ 
	/* Hide only visually, but have it available for screenreaders: www.webaim.org/techniques/css/invisiblecontent/ */
	.visuallyhidden { position:absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); }
	.invisible { visibility: hidden; } 	/* Hide visually and from screenreaders, but maintain layout */
	
	/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix - only with a different class name to make it more semantic */
	.group:before, .group:after { content: "\0020"; display: block; height: 0; visibility: hidden; } 
	.group:after { clear: both; } /* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
	.group { zoom: 1; }
	
/*	4. T Y P O G R A P H Y
    ........................................................................................................................................ */
	

/* Base typography */
/* body, input, button, textarea { 
    font-size: 15px; 
    line-height:18px; 
    color: #9b9b9b; 
    font-family: Arial;
} */

/* Element spacing */
p, h1, h2, h3, h4, h5, h6, fieldset, pre, #main ul, #main ol, #main dt, #main dd, #main table, #main caption, #main img,
.page-content ul, .page-content ol, .page-content dt, .page-content dd, .page-content table, .page-content caption, .page-content img, .sidebar .widget, #footer .widget, .slider, .post-content ul,
.post-content ol, .post-content dt, .post-content dd, .post-content table, .post-content caption, .post-content img, .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth,
.three_fifth, .four_fifth, .one_sixth, .five_sixth, .contact-info-shortcode, #social-networking { 
    margin-bottom: 20px; 
}

.share-this { margin-bottom: 20px; }
.shop-links { margin-bottom: 12px; }
.shop-links li a { 
    color:#dfdfdf; 
    background: url(images/layout/button-go.png) no-repeat left center; 
    padding-top: 4px!important; 
    padding-left:18px!important; 
}
.footer-meta img, .footer-meta p { margin-bottom: 0; }
#main-headline, .slider, .section-title, #related-posts > h2, #single-item, #search-results .page-name { 
    margin-bottom: 0px; 
    color:#dfdfdf;
}
.slider { margin-bottom: 20px; }
.section-title { margin-bottom: 10px; }

#main-headline, .section-title, #related-posts > h2, #search-results { padding-left:0px;}
#filter { margin-bottom: 25px; color:#dfdfdf; padding-left:5px;}
h3, #related-posts > h2 { font-weight:normal; font-size:30px; margin-bottom:20px;}
.section-title {font-size: 24px; font-weight: normal;}
#header { margin-bottom: 5px; }
#footer .widget, .sidebar .widget, #search-results .blog-post, .post, .comments_navigation { margin-bottom: 40px; }

/* Heading styles */
h1 { font-size: 16px; line-height: 20px; }
h2 { font-size: 14px; line-height: 20px; margin-bottom: 8px;}
h3 { font-size: 28px; line-height: 25px; margin-bottom:8px; margin-top:18px;}
h4 { font-size: 12px; line-height: 20px; }
h5 { font-size: 11px; line-height: 20px; }
h6 { font-size: 10px; line-height: 20px; }

/* Typography enhancements */
html { -webkit-font-smoothing: antialiased; }
table { font-size: inherit; font: 100%; }
p { margin-bottom:12px;}
blockquote { 
    font-size: 1.1em; 
    font-style: italic; 
    padding-left: 28px; 
    background: url('images/layout/quote-mark.png') no-repeat left top; 
}
input { font-size: .9em; }
small { font-size: 85%; }
strong, th { font-weight: bold; }
sub { font-size: smaller; }
sup { font-size: smaller; }
pre, code, kbd, samp { font-family: monospace, sans-serif; }

/* No custom fonts needed - using Google Fonts Rubik */

/* Typography helper classes */
.caps { 
    letter-spacing: 0.1em; 
    font-variant: small-caps; 
    text-transform: lowercase; 
}

abbr { 
    letter-spacing: 0.1em; 
    font-variant: small-caps; 
    text-transform: lowercase; 
}

/* Use Rubik from Google Fonts */
/*.amp { 
    font-size: 1.2em; 
    font-family: 'Rubik', Baskerville, "Goudy Old Style", Palatino, "Book Antiqua", Georgia, serif; 
    font-style: italic; 
    font-weight: normal; 
} */

/* Widget borders */
.widget_categories ul {border-top: 1px dotted; padding-top: 20px;}


/*  5. H E A D I N G S
    ....................................................................................................................................... */
	
	h1, h2, h3, h4, h5, h6 { color: #dfdfdf; font-weight:400;} /* letter-spacing: 0.1em;*/ 
	h1, h2, h4, h5, h6 { text-transform:uppercase; } /* letter-spacing: 0.1em;*/


	#main-headline { text-transform: none; color: #dfdfdf; letter-spacing: normal; line-height: 40px; font: normal 22px Georgia, "Times New Roman", Times, serif; } /* main headline at the top of the landing page */	
	.section-title a { float: right;}	
	.project-link + h3 a { display: block; color: #dfdfdf; font-size: 22px; padding-top: 4px; font-weight: normal; text-transform: uppercase; padding-bottom: 5px; padding-left:0px; margin-bottom:0px;}	
	.project-link h3 { margin-bottom: 25px; }	
	.portfolio-item h3 { margin-top: 0px; }
	.latest-project h3 { margin-top: 0px; }
	.related-post h3 { margin-top: 0px; }	
	#footer .widgettitle { text-transform: uppercase;} /*letter-spacing: 0.1em;*/ 



/*  6. L I N K S
    ....................................................................................................................................... */
	
	a { text-decoration: none; }
	a:link { color: #ff4c28; } /* was #cccccc */
	a:visited { color: #dfdfdf; }
	a:hover { color: #ffffff; text-decoration: underline; }
	a:active { color: #dfdfdf; position: relative; top: 1px; }
	a:hover, a:active { outline: none; } /* Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test */
	h1 a, h2 a, h3 a, h4 a, h5 a { font-style: normal; }
	.csstransitions a, .csstransitions a img, .csstransitions input[type="submit"], .csstransitions button { -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -o-transition: color .2s ease-in-out, opacity .2s ease-in-out, border-color .3s ease-in-out; transition: all .2s ease-in-out; }
	
	

/*  7. L I S T S 
    ....................................................................................................................................... */
	
	#main ol, .page-content ol { list-style-type: decimal; }
	#main ul, .page-content ul { list-style-type: circle; }
	#main ol ol, .page-content ol ol, #main ul ul, .page-content ul ul { margin-left: 28px; } /* indent the lists wrapped by other lists */
	.portfolio-gallery ul, .portfolio-gallery { list-style: none; }
	


/*	8. F O R M S
    ........................................................................................................................................ */
		
	/* colors for form validity */
	input:valid, textarea:valid {  }
	input:invalid, textarea:invalid { border-radius: 1px; -moz-box-shadow: 0px 0px 5px red; -webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red; }
	.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; } 
	
	input[type="text"], select, textarea { margin: 0; width: 90%; } /* webkit browsers add a 2px margin outside the chrome of form elements */ 
	select, input, textarea, button { font-size: 99%; color: rgb(150, 150, 150); }
	input[type="text"], textarea { padding: 7px; }
	select { max-width: 250px; padding: 4px 4px 4px 0; background: rgba(255, 255, 255, 0.7); border: 1px solid rgb(230, 230, 230); }
	button, input, textarea { font-family: inherit; font-size: 1em; }
	label { display: inline-block; margin-bottom: 5px; }
	label, input[type=button], input[type=submit], button { cursor: pointer; } 	/* hand cursor on clickable input elements */
	.borderradius input[type="text"], .borderradius textarea, .borderradius .form-status, .borderradius select { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
	.boxshadow input[type="text"]:focus, .boxshadow textarea:focus { -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.1); box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);  }
	
	/* buttons */
	input[type="submit"], button, input[type="button"] { padding: 5px 10px; background: #798089; color: #fff; color: rgba(255, 255, 255, 0.8); } 
	input[type="submit"]:hover, button:hover, input[type="button"]:hover { background: #5f6875; color: #fff; color: rgba(255, 255, 255, 0.8); }
	input[type="submit"] { display: inline; vertical-align: top; }
	
	/* CSS3 submit buttons (with the help of modernizer classes - start */
	.borderradius input[type="submit"], .borderradius button, input[type="button"] { -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius: 15px; }														   
	input[type="submit"]:active, button:active, input[type="button"]:active { position: relative; top: 1px; }													   												   
	/* CSS3 submit buttons - end */
	
	/* align checkboxes, radios, text inputs with their label
	   by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css  */
	input[type="radio"] { vertical-align: text-bottom; }
	input[type="checkbox"] { vertical-align: bottom; }
	
	/* style the text inputs only */
	input:not([type=submit]):not([type=file]), textarea { padding: 7px; max-width: 450px; display: block; background: #fefefe; background: rgba(255, 255, 255, 0.3); color: #7c7c7c; }
	.csstransitions input:not([type=submit]):not([type=file]), .csstransitions textarea { -moz-transition: all .2s ease-in; -webkit-transition: all .2s ease-in; -o-transition: all .2s ease-in; transition: all .2s ease-in; }
	.borderradius input:not([type=submit]):not([type=file]), .borderradius textarea { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
	
	/* text inputs on focus */
	input:not([type=submit]):not([type=file]):focus, textarea:focus { background: rgba(255, 255, 255, 0.5); }
	.csstransforms input:not([type=submit]):not([type=file]):focus, .csstransforms textarea:focus { -ms-transform: scale(1.02, 1.02); -webkit-transform: scale(1.02, 1.02); -o-transform: scale(1.02, 1.02); -moz-transform: scale(1.02, 1.02); transform: scale(1.02, 1.02); }
		


/*	9. I M A G E S
    ........................................................................................................................................ */
	
	img, a img { font-style: italic; }
	.csstransitions img { -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
	
	/* wordpress built-in image-related classes */
	img.alignright, .wp-caption.alignright { float: right; margin: 0 0 1em 1em; }
	img.alignleft, .wp-caption.alignleft { float: left; margin: 0 1em 1em 0; }
	img.aligncenter, .wp-caption.aligncenter { display: block; margin-left: auto; margin-right: auto; }
	img.aligncenter { margin-top: 20px; }
	a img.alignright { float: right; margin: 0 0 1em 1em; }
	a img.alignleft { float: left; margin: 0 1em 1em 0; }
	a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
	#main { overflow: hidden; }
	#main img ~ img, #portfolio-item-meta img ~ img { margin-left: 20px; }
	
	.wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; font-style: italic; margin-bottom: 20px; }
	.wp-caption img, .wp-caption img a { margin: 0 !important; padding: 0; border: 0 none; }
	.wp-caption .wp-caption-text { padding: 0 4px 5px; margin: 0; }
	.wp-smiley { max-height: 13px; margin: 0 !important; }

	.gallery { margin: auto; float: left; width: 100%; list-style-type: none !important; }
	.gallery-image { border: 1px solid #efefef; margin-left: 0; }
	.gallery-icon a { display: block; }
	.gallery-caption { padding: 0 4px 5px; font-style: italic; margin-bottom: 0 !important; display: block; }
	.gallery-item { float: left; text-align: center; margin-left: 0; }
	.gallery-item { width: auto; float: left; margin: 10px 0 0 0; }
	.gallery-item img { margin: 0 !important; padding: 0; }
	.gallery-item a { float: left; border: none; margin: 0; padding: 0; }
	
	
	
/*	10. O T H E R   E L E M E N T S
    ........................................................................................................................................ */
	.single-post-content {border-bottom: 1px dotted;}
	
	td, td img { vertical-align: top; }
	td { padding: 2px 4px; } 
	/* Set sub, sup without affecting line-height: gist.github.com/413930 */
	sub, sup { font-size: 75%; line-height: 0; position: relative; }
	sup { top: -0.5em; }
	sub { bottom: -0.25em; }
	/* pre { white-space: pre; /* CSS2 */ white-space: pre-wrap; /* CSS 2.1 */ white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */ word-wrap: break-word; /* IE */ } */
	pre {
		overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
		white-space: pre-wrap; /* css-3 */
		white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
		white-space: -pre-wrap; /* Opera 4-6 */
		white-space: -o-pre-wrap; /* Opera */
		width: 99%;
		word-wrap: break-word; /* IE */
	}
	pre { font-size: .9em; border: 1px solid #231f20; line-height: 20px; background: #fff url('images/layout/pre-code-bg.png') repeat left top; overflow: auto; overflow-y: hidden;  /* Hides vertical scroll created by IE */ }
	pre code { font-family: Consolas, "Courier New", Courier, monospace; margin: 0 0 0 40px; padding: 18px 0; display: block; }
	dt { font-size: 1.5em; font-weight: bold; }
	dd { display: list-item; list-style: square inside none; }
	
	#main table, .page-content table, .post-content table { border: 1px solid #231f20; border-collapse: collapse; background: #fff; }
	#main tr:nth-of-type(odd), .page-content tr:nth-of-type(odd), .post-content tr:nth-of-type(odd) { background-color: #eff3f4; } /* zebra style table */
	#main th, #main td, .page-content th, .page-content td, .post-content th, .post-content td { border: 1px solid #231f20; padding: 9px 22px; }
	#main th, .page-content th, .post-content th { font-variant: small-caps; text-transform: lowercase; }
	#main caption, .page-content caption, .post-content caption { font-size: 1.2em; font-weight: bold; font-family: "PT Sans Narrow", sans-serif; }
	


/*  11. S L I D E R S
    ....................................................................................................................................... */
	
/* ============================
   11. S L I D E R S
   ============================ */

#slides {
  position: relative;
  margin: 0 auto;
}

.slides {
  position: relative;
  margin: 0 auto;
}

.csstransitions #slides a {
  -moz-transition: none;
  -webkit-transition: none;
  -o-transition: none;
  transition: none;
}

.slides-container {
  display: none; /* Prevents content flash */
}

/* Slider pagination container */
.pagination {
  clear: both;
  text-align: center;
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 99;
  margin: 30px 0;
  width: auto;
  background: transparent !important;
}

/* Pagination list items */
.pagination li {
  display: inline-block;
  margin: 0;
  padding: 0;
  background: none !important;
  border: none !important;
}

/* Pagination links styled as dots */
.pagination li a {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 5px;
  border-radius: 50%;
  background-color: #ccc;  /* Light gray for inactive dots */
  opacity: 0.5;
  text-indent: -9999px; /* Hide text */
  box-shadow: none !important;
  background-image: none !important; /* Remove any sprite backgrounds */
  border: none !important;
  cursor: pointer;
  transition: background-color 0.3s ease, opacity 0.3s ease;
}

/* Hover effect on dots */
.pagination li a:hover {
  background-color: #999;
  opacity: 0.8;
}

/* Active/current dot styling */
.pagination li.current {
  background-color: transparent !important; /* Remove dark square */
}

.pagination li.current a {
  background-color: #fff !important; /* White dot */
  opacity: 1 !important;
  cursor: default;
}

/* Next-previous links (unchanged) */
.opacity #next-prev-links {
  opacity: 0;
}

#slides #next-prev-links img,
.slides #next-prev-links img {
  display: block;
}

#slides .next,
#slides .prev,
.slides .next,
.slides .prev {
  position: absolute;
  width: 41px;
  height: 41px;
  display: block;
  z-index: 99;
  top: 48%;
  margin: -10px 15px 0;
}

#slides .prev,
.slides .prev {
  left: -12px;
}

#slides .next,
.slides .next {
  right: -12px;
}

#slides .next:active,
#slides .prev:active,
.slides .next:active,
.slides .prev:active {
  top: 48.3%;
}

/* Slide styling */
.slide {
  position: relative;
  width: 940px;
  overflow: hidden;
}

.slide img {
  margin-bottom: 0;
}

/* Portfolio slider */
#single-item {
  width: 620px;
}

#single-item .slide {
  width: 620px;
  height: 100px;
}

#single-item .slider-img {
  display: block;
}

#single-item figure {
  display: block;
}

/* Latest articles slider */
#latest-articles-slider {
  width: 940px;
  height: 142px;
  position: relative;
}

#latest-articles-slider > div {
  width: 620px;
  height: 142px;
  position: relative;
  float: left;
}

#latest-articles-slider .slides_container {
  overflow: hidden;
  display: none;
  width: 620px;
  position: relative;
}

.slides_container .latest-article {
  width: 620px;
  height: 142px;
  display: block;
}

.latest-articles-pagination {
  position: relative;
  left: 10px;
}

.latest-articles-pagination li {
  float: left;
  position: relative;
  width: 141px;
  margin-left: 7px;
}

.latest-articles-pagination li img {
  border: 1px solid transparent;
}

.latest-articles-pagination li.current img {
  border: 1px solid #b7b7b7;
}


/*  12. L I G H T B O X   A N D   M O D A L   W I N D O W
    ....................................................................................................................................... */
	
	/* remove the borders and text shadows in pretty photo lightbox */
	.pp_pic_holder { text-shadow: none; }
	
	/* stop the previous and active links from flickering, when clicked */
	.pp_arrow_previous:active, .pp_arrow_next:active { position: static; top: 0; }
	
	/* modal window */	
	#lean_overlay { position: fixed; z-index: 100; top: 0px; left: 0px; height: 100%; width: 100%; display: none; background: #fff url('images/layout/modal-bg.png'); }
	#modalContactForm { display: none; left: 51%; background: #fff; padding: 36px 20px 20px 40px; }
	#close-reveal-modal { font-size: 22px; line-height: .5; position: absolute; top: 8px; right: 11px; color: #aaa; font-weight: bold; cursor: pointer; } 
	#close-reveal-modal:hover { color: #7c7c7c; }
	.borderradius #modalContactForm { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
	.boxshadow #modalContactForm { -webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.2); }	
	
	
	
/*	13. H E A D E R
    ........................................................................................................................................ */	
		
	#header { padding: 0 0 5px 0; display: table; }
  	#logo, #menu { display: table-cell; vertical-align: middle; }
  	#logo { float: left; }
  	#wp-title-logo { color: #444652; font: normal 400 37px Georgia, "Times New Roman", Times, serif; }	
	.csstransitions #logo { -moz-transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
  	/*.opacity #logo, .opacity #wp-title-logo { opacity: 0.75; }*/
  	.opacity #logo:hover, .opacity #wp-title-logo:hover { opacity: 1; }
  	
  	#social-networking { list-style: none; height: 25px; padding-top: 30px;}
	#social-networking li { float: right; }
	#social-networking a img { border: none; display: block; padding-left: 6px; }
	.opacity #social-networking a img { opacity: 1; }
	.opacity #social-networking a:hover img { opacity: .6; }

	#menu-menu {float: right; }
	
  	
/*  14. M A I N   N A V I G A T I O N
    ....................................................................................................................................... */
	
	#menu { display: table-cell; vertical-align: middle; height: 40px; font-weight:700;}
	#menu li { float: left; position: relative; display: block; }
	#menu .menu > li { margin-left: 10px; } 
	#menu .menu > li:after { position: absolute; content: " "; width: 100%; height: 100%; } /* position the pseudo element right beneath a top-level li element, so we can use the mentioned pseudo element as a way to introduce some extra space between the sub-menu and the currently hovered top-level link */
	.borderradius #menu .menu > li { -moz-border-radius: 1px; -webkit-border-radius: 1px; border-radius: 1px; }
	#menu a { display: block; line-height: 25px; text-transform: uppercase; font-size: 14px; border: 1px solid transparent; padding: 3px 3px; color: #dfdfdf; font-weight:normal; font-size:24px;}
	#menu a:hover { display: block; line-height: 25px; text-transform: uppercase; font-size: 14px; border: 1px solid transparent; padding: 3px 3px; color: white; font-weight:normal; font-size:24px;}
	.csstransitions #menu a { -moz-transition: all .1s ease-in-out; -webkit-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out; transition: all .1s ease-in-out; }
	
	/* DROPDOWN */
	#menu .sub-menu { position: absolute; margin: 10px 0 0 0; z-index: 9999; left: -9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */ }
	.boxshadow #menu .sub-menu { -webkit-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .05); -moz-box-shadow: 0 0 4px 1px rgba(0, 0, 0, .05); box-shadow: 0 0 4px 1px rgba(0, 0, 0, .05); }
	.opacity #menu .sub-menu { opacity: 0; /* Set initial state to transparent */ } 
	#menu .sub-menu li { margin-left: 0; float: none; /* Introducing a padding between the li and the a give the illusion spaced items */ }
	#menu .sub-menu a { white-space: nowrap; /* Stop text wrapping and creating multi-line dropdown items */ }
	.csstransitions #menu li ul { -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; -o-transition: opacity .25s ease-in-out; transition: opacity .25s ease-in-out; }
	#menu li:hover ul { /* Display the dropdown on hover */ left: 0; /* Bring back on-screen when needed */ }
	.opacity #menu li:hover ul { opacity: 1; /* Fade to opaque */ }
	#menu li:hover ul li a:hover { /* Set styles for dropdown when items are hovered */ background: #56575e; background: rgba(78, 79, 86, .8); border: 1px solid transparent; border-bottom: none; color: #fff; }	
	
	/* Dropdown links */
	#menu .sub-menu a { padding: 4px 9px; text-transform: none; border: 1px solid transparent; background: #ededed; line-height: 20px; /* reset to normal line height */ font-size: 10px; border: 1px solid #e0e0e0; border-bottom: none; background: #fff; color: #ffce00; }
	#menu .sub-menu li:last-child a { border-bottom: 1px solid #e0e0e0; }
	.borderradius #menu .sub-menu li:first-child a { -webkit-border-top-right-radius: 1px; -webkit-border-top-left-radius: 1px; -moz-border-radius-topright: 1px; -moz-border-radius-topleft: 1px; border-top-right-radius: 1px; border-top-left-radius: 1px; }
	.borderradius #menu .sub-menu li:last-child a { -webkit-border-bottom-right-radius: 1px; -webkit-border-bottom-left-radius: 1px; -moz-border-radius-bottomright: 1px; -moz-border-radius-bottomleft: 1px; border-bottom-right-radius: 1px; border-bottom-left-radius: 1px; }
	
	#menu .current-menu-item > a:hover, #menu .selectedLava > a { color: #ff4c28;} /* top-level menu links */
	#menu a:hover { color: #dfdfdf;} /* top-level menu links */
	#menu a, #menu a:hover{ font-weight:normal; font-size:24px;}	
	
	/* Current menu item */
	#menu .current-menu-item > a { color: #ff4c28; border-bottom:#ff4c28;}
	#menu .sub-menu .current-menu-item > a { color: red; }
	#menu .sub-menu .current-menu-item > a:hover { color: yellow; text-decoration: none; }
	
	/* sub menu indicator generated by jQuery plugin called superfish */
	#menu .parent > a { position: relative; padding-right: 17px; } /* note: the "parent" class is generated by a custom walker */
	#menu .parent > a:after { content: " "; text-indent: -9999px; position: absolute; margin: 8px 0 0 5px; width: 6px; height: 4px; background: url('images/layout/menu-arrow.png') no-repeat left top; }
	
	/*.boxshadow #menu .backLava, .boxshadow #menu .selectedLava { -webkit-box-shadow: inset 0 0 4px 1px rgba(0, 0, 0, .05); -moz-box-shadow: inset 0 0 4px 1px rgba(0, 0, 0, .05); box-shadow: inset 0 0 4px 1px rgba(0, 0, 0, .05); }
	#menu .backLava { background-color: #e2e2e2; background-color: rgba(200, 200, 200, .6); }
    #menu .selectedLava { background-color: #e2e2e2; background-color: rgba(200, 200, 200, .6); } */

	

/*	15. P A G E S 
    ........................................................................................................................................ */	
	/*#sidebar-blog a { font-size:24px; font-weight:normal; margin-bottom: 0px; text-decoration:none; line-height:26px; text-transform:uppercase; }	*/
	.two-cols-right-fixed #content .page-content, .two-cols-left-fixed #content .page-content, .sidebar { display: inline; }
	
	/*.two-cols-right-fixed #content .page-content { margin-right: 30px; width: 690px; }
	.two-cols-left-fixed #content .page-content { margin-left: 30px; width: 690px; }
	.two-cols-right-fixed .sidebar { width: 220px; }
	.two-cols-left-fixed .sidebar { width: 220px; }*/
	
	/* sidebar positioning */
	.two-cols-left-fixed .sidebar { float: left; }
	.two-cols-left-fixed .page-content { float: right; }
	.two-cols-right-fixed .page-content { float: left; }
    .two-cols-right-fixed .sidebar { float: right; }



/*	16. H O M E  T E M P L A T E
    ........................................................................................................................................ */
	
	.no-slider-and-intro { margin-bottom: 30px; }
	/*.with-slider-or-intro, .latest-articles { margin-bottom: 30px; padding-top: 30px; }*/
	.latest-articles { margin-top: 5px; }
	/*.latest-article a img {margin-top:35px;}*/
	
	.four-items-per-row.latest-projects a span, .four-items-per-row .project-link span { top: 175px; left: 75px; }
	.three-items-per-row.latest-projects a span, .three-items-per-row .project-link span { top: 210px; left: 126px; }
 	.two-items-per-row.latest-projects a span, .two-items-per-row .project-link span { top: 330px; left: 194px; }
 
 	.latest-article-title { line-height: 1; margin-bottom: 5px;}
 	.latest-article-title a { font-size: 20px; font-weight: normal; text-transform: uppercase; color: #dfdfdf;}
	.latest-article-content .read-more { float:right; padding-right:10px; }
	.read-more { float:right; padding-right:10px; text-transform:uppercase; font-size: 11px; font-weight: 400;}
	span.read-more a:hover {text-decoration:underline;}
	.latest-article-content p {font-size:15px;}
	.read-more a {font-weight:normal; font-size:14px; }


/*	17. B L O G
    ........................................................................................................................................ */	
	.cat-item a {color: #81817f;}
	.current-cat a {color: #dfdfdf;}
	.datecircle { width:70px; height:70px; background: url('images/layout/blogdate-bg.png'); -webkit-border-radius: 35px; -moz-border-radius: 35px; border-radius: 35px; text-align: center;}
	.datecircle p { padding-top:25px; color:white; font-size:34px;line-height:20px;}


	
	//.single-post-content {padding-left:5px; }
	.post time { text-transform: lowercase; font-variant: small-caps; }
	.post-meta li { margin: 0 0 3px 0; }
	.post-meta.column-width li { max-width: 215px; } /* reduce the width of the post meta box if the sidebar is disabled */	
	#blog-posts .post-meta { list-style: none; margin: 0; }
	.post-content > p:first-line { text-transform: lowercase; font-variant: small-caps; letter-spacing: .1em; font-size: 1.056em; }
	.post-content .read-more, .blog-post .read-more { margin-top: 10px; }
	.post-title + p { margin-bottom: 10px; } /* style the read more link in the search results */
	h2 .post-title { position: relative; line-height: 1; color: #47413e; }
	.post-thumb { margin: 0 0 3px 0; }
	#blog-posts .post-thumb a img { display: block; margin-bottom: 0; }
	.share-this { clear: both; position: relative; }
	.share-this:before { content: " "; position: absolute; top: 2px; left: 0; width: 100%; height: 1px; text-shadow: none; }

	/* position the elements on the page properly, depending on the position of the sidebar */
	.post .post-content-position { position: relative; left: 20px; width: 520px; }
	.full-width-post { position: relative; left: 10px; }
	
	.share-this { position: relative; }
	.twitter-share-button { display: inline-block; text-indent: -9999px; }
	.blog-pagination a { margin-right: 13px; text-transform: uppercase; }
	.page-link-title { margin-right: 16px; }
	
	.single-post .share-this div, .share-this .share { float: left; }
	.share-this .share { display: inline-block; padding-right: 20px; }
	/*.single-post .share-this { padding: 20px 0; }*/ 
	
	/* WordPress built-in class for handling sticky posts */
	.sticky { }
	


/*	18. P O R T F O L I O
    ........................................................................................................................................ */	

h3.linked-title,
h3.unlinked-title {
    font-size: 22px;
    font-weight: normal;
    line-height: 1.2;
    margin: 0 0 10px 0;
    text-transform: uppercase;
}

/* Make the <a> inside linked-title inherit all these styles exactly */
h3.linked-title a {
    color: inherit;           /* same color as h3 */
    font-size: inherit;       /* inherit font size */
    font-weight: inherit;     /* inherit font weight */
    line-height: inherit;     /* inherit line height */
    font-family: inherit;     /* inherit font */
    text-decoration: none;    /* remove underline */
    cursor: pointer;          /* pointer cursor for links */
    text-transform: uppercase;
}
	

/* === Fix filter category spacing === */
#filter {
  display: flex;
  gap: 13px; /* Even spacing between items */
  list-style: none;
  padding: 0;
  margin: 0;
}

#filter li {
  display: block; /* Ensures a-tags inside render cleanly */
}

#filter a {
  display: block; /* Optional but improves spacing handling */
  text-transform: uppercase;
  font-size: 24px;
  text-decoration: none;
  color: #dfdfdf;
}

#filter .active a {
  text-decoration: underline;
  font-weight: normal;
}

#filter a:hover {
  text-decoration: underline;
}

#filter a {
  white-space: nowrap;
}

#filter {
  display: flex;
  gap: 18px;
  list-style: none;
  padding: 0;
  margin: 0 0 4px 0; /* Add bottom margin */
}

#filter {
  padding-top: 0px;
}

	
	.project-link { position: relative; display: block; overflow: hidden;}
	a.project-link { height: 142px; }
	.latest-projects a span, .portfolio-item .project-link span, #related-posts .project-link span { opacity: 0; display: block; background: url('images/layout/view-details.png') no-repeat; width: 68px; height: 68px; position: absolute; z-index: 100; text-indent: -9999px; }
	
	/* make sure the columns are properly aligned, when the projects are filtered on the portfolio page, by clearing the floats on items that contain a class of "alpha".
	 * Do the same for the "Related Projects" section in the single item view, and the "Latest Project" section on the home page.
	 */
	.portfolio-item.alpha, .related-post.alpha, .latest-project.alpha { clear: both; } 
	
	.portfolio-item { overflow: hidden; }
	.item-heading h2 { margin-bottom: 7px; }
	
	/* S I N G L E */
	.project-title a { font-size: 0.75em; }
	.item-term { padding: 0px 7px 0px 0px; background: #f3f3f3; background: rgba(0, 0, 0, .05); margin-right: 7px; }
	.borderradius .item-term { -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; }
	#single-item { text-align: right; }
	#related-posts { margin-bottom: 0px; padding-top: 15px; }	
	.post-header {font-size:30px; font-weight:normal; padding: 20px 0; margin-bottom: 0px;}

/*	19. W I D G E T S
    ........................................................................................................................................ */	
	
	.widget li { margin: 0 0 5px 0; }
	
	.widget_archive li a, .widget_categories li a, .widget_nav_menu li a, .widget_links li a, .widget_pages li a, 
	.widget_recent_entries li a, .widget_recent_comments li a, .widget_rss li a, .widget_meta li a { display: block; }
	
	/* Insert a right arrow on the right-hand side of each of the widget's links, when they're hovered over */
	.widget_archive li a:after, .widget_categories li a:after, .widget_nav_menu li a:after, .widget_links li a:after, .widget_pages li a:after, 
	/*.widget_recent_entries li a:after, .widget_recent_comments li a:after, .widget_rss li a:after, .widget_meta li a:after { content: '\2192'; float: right; visibility: hidden; font-size: 1.29em; position: relative; bottom: 2px; }*/
	
	.widget_archive li a:hover:after, .widget_categories li a:hover:after, .widget_nav_menu li a:hover:after, .widget_links li a:hover:after, .widget_pages li a:hover:after, 
	.widget_recent_entries li a:hover:after, .widget_recent_comments li a:hover:after, .widget_rss li a:hover:after, .widget_meta li a:hover:after { visibility: visible; }
	
	.widget_nav_menu .sub-menu { margin-top: 15px; }
	.widget_nav_menu .sub-menu li { margin-left: 2em; }
	#footer .widget_nav_menu .sub-menu li:last-child { margin-bottom: 15px; }
	
	/* flickr widget */
	#flickr a { border-bottom: none; }
	#flickr a:hover { background: none; }
	#flickr div { display: inline; }
	#flickr img { width: 42px; height: 42px; padding: 0 13px 10px 0; }
	.csstransforms #flickr img:hover { -ms-transform: scale(1.20, 1.20); -webkit-transform: scale(1.20, 1.20); -o-transform: scale(1.20, 1.20); -moz-transform: scale(1.20, 1.20); transform: scale(1.20, 1.20); }
		
	/* twitter widget */
	.tweets { font-style: italic; }
	.read-more, .timesince { display: block; }
	.tweets li { 
		padding: 0 0 0 25px; 
		background: url('images/layout/twitter-feed-icon.png') no-repeat 0 6px; 
		/* wrap long URLs, strings of text, and other content */
		white-space: pre; /* CSS 2.0 */
		white-space: pre-wrap;      /* CSS 2.1 */
		white-space: pre-line;      /* CSS 3.0 */
		white-space: -pre-wrap;     /* Opera 4-6 */
		white-space: -o-pre-wrap;   /* Opera 7 */
		white-space: -moz-pre-wrap; /* Mozilla */
		word-wrap: break-word;    
	}
	
	/* popular posts widget */
	.widget.popular-posts ul { clear: both; }
	.widget.popular-posts ul:before, .widget.popular-posts ul:after { content: "\0020"; display: block; height: 0; visibility: hidden; } 
	.widget.popular-posts ul:after { clear: both; }
	.popular-posts ul li { position: relative; clear: both; }
	/* title styles */
	.wpp-post-title { }
	/* thumbnail styles */
	.wpp-thumbnail { float: left; margin-right: 7px; margin-bottom: 7px; }
	.wppnothumb, .wppgen { }
	/* excerpt styles */
	.wpp-excerpt {}
	/* Stats tag styles */
	.post-stats { font-size: 0.9em; display: block; }
	.wpp-comments {}
	.wpp-views {}
	.wpp-author { }
	.wpp-date {}
	/* WP-PostRatings styles */
	.wpp-rating {}

	/* calendar widget */
	#wp-calendar thead { border-bottom: 1px solid; }
	#wp-calendar th, #wp-calendar tbody td { text-align: center; padding: 3px 6px; }
	#wp-calendar tfoot td { padding-top: 3px; }
	#wp-calendar caption { font-size: 1.3em; font-weight: bold; text-align: center; margin-bottom: 15px; }

	/* categories widget */
	.widget .children { /* indented lists */ padding-left: 1em; }



/*	20. S H O R T C O D E S
    ........................................................................................................................................ */	
	
	/* Fluid Column Shortcodes */
    .one_half { width: 48%; }
    .one_third { width: 30.66%; }
    .two_third { width: 65.33%; }
    .one_fourth { width: 22%; }
    .three_fourth { width: 74%; }
    .one_fifth { width: 16.8%; }
    .two_fifth { width: 37.6%; }
    .three_fifth { width: 58.4%; }
    .four_fifth { width: 67.2%; }
    .one_sixth { width: 13.33%; }
    .five_sixth { width: 82.67%; }
    .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth, .three_fifth, .four_fifth, .one_sixth, .five_sixth { position:relative; margin-right:4%; float:left; }
    .last { margin-right: 0 !important; clear:right; }
    .clearboth {clear: both; display: block; font-size: 0; height: 0; line-height: 0; width: 100%; }
    	
	/* contact info */
	.contact-info-shortcode { list-style: none !important; }
	.contact-info-shortcode li { padding-left: 45px; min-height: 33px; padding-top: 4px; position: relative; margin: 0 0 15px 0; }	
	.contact-info:before { content: " "; background: url('images/layout/contact-info-icons.png') no-repeat top left; width: 33px; height: 33px; display: block; position: absolute; top: 0; left: 0; }
	.street-address, .city-zip, .state { display: block; }
	.location:before { background-position: -39px 0; }
	.telephone:before { background-position: -78px 0; }
	.my-mail:before { background-position: top left; }
    
    /* contact form */
    .success { color: #7b9b2f; }
    .error { color: #e44141; }
	.form-status { display: none; background: #eae8e8; background: rgba(0, 0, 0, 0.06); max-width: 400px; padding: 16px 10px; position: relative; margin-top: 35px; }
	.contact-form .status-icon { display: block; position: absolute; top: -10px; left: -5px; background: url('images/layout/info-icons.png') no-repeat left top; width: 28px; height: 28px; }
	.contact-form .success .status-icon { background-position: -33px 0; }
	.contact-form .loading-img { position: relative; left: 10px; top: 4px; border: none; } /* loading gif at the end of the contact form */
    .invalid-field { border-color: #edaaaa; }
    
    
    
/*	21. C O M M E N T S
    ........................................................................................................................................ */	
	
	#main .comment-list { list-style: none; }
	#number-of-comments { margin-top: 40px; }
	.comment { margin: 0 0 30px 0; }
	.comment-author { position: relative; }
	.avatar { float: left; margin: 0 10px 0 0; }
	.author-link, .author-meta { line-height: 1; } 
	.author-link { margin-bottom: 10px; }
	.author-meta { margin: 2px }
	#main .children { /* indented comments */ padding-left: 4em; list-style: none; }
	#cancel-comment-reply-link { margin-left: 13px; }
	.form-allowed-tags { max-width: 450px; }
	
	/* comments navigation */
	.comments_navigation { text-transform: uppercase; font-size: 1.2em; }
	.comments_navigation .page-numbers { padding-right: 10px; }
	
	/* wordpress built-in class for highlighting the author comments */
	.bypostauthor > article { background: url('images/layout/post-author.png') no-repeat right top; }



/*  22. 4 0 4   P A G E  
    .......................................................................................................................................... */
		
	#not-found { text-align: center; }
	#not-found-heading { font-size: 150px; font-weight: bold; }
	#not-found-img { border: none; }
	#not-found-form input { width: 500px; margin: 0 auto; }
	
	
	
/*	23. F O O T E R
    ........................................................................................................................................ */
	
	#footer .footer-widgets li:last-child { margin-bottom: 0; }
	.footer-widgets { margin-bottom: 30px; padding-top: 30px; }
	.footer-meta { padding: 30px 0 20px; }
	#back-top { float: right; text-transform: uppercase;} /* letter-spacing: 0.1em;  link that takes the user back to the top of the page */
	#back-top span { position: relative; top: -3px; }
	#footer-logo { text-align: center; }
	.opacity #footer-logo img { opacity: .3; }
	.opacity #footer-logo a:hover img { opacity: .7; } 
	#footer { color: #dfdfdf; opacity:0.6; font-size: 12px; line-height:14px;}
	#footer a { color: #dfdfdf;}

/*      23A. C U F O N  O V E R R I D E */

a .cufon {border-bottom: solid 1px transparent; padding-bottom: 2px;}
a:hover .cufon {color:violet;}
.current_page_item .cufon {border-bottom: solid 1px orange; padding-bottom: 2px;}
a .cufon-active #menu a:active {color:#dfdfdf;}
.view-all a {color:#dfdfdf; font-weight: normal; font-size: 24px;}

/* 	24 E X T R A */

article p a {
color: #ff4c28 !important;
}

.blog-footer a {
color: #cccccc !important;
}

.blog-footer{
font-size:80% !important;
}

/* FAQ SECTION */
h2.qa-faq-title {
margin-bottom: 10px;
font-size:18px;
text-transform: none;
}
.qa-category {
margin-bottom: 0px;
margin-top: 15px;
}
.qa-faq-answer {
padding-left: 15px;
}

/`* ---------------------------------------------
   Custom link & social layout
   --------------------------------------------- */
#links123 {
    display: flex;
    flex-direction: column; /* stack vertically */
    align-items: flex-end;  /* right align the two rows */
    gap: 5px;
    position: relative;
}

#social-networking {
    padding-top: 0;
    margin-bottom: 5px;
    list-style: none;
    display: flex;
    gap: 6px;
    position: relative;
    z-index: 20;           /* above menu */
    justify-content: flex-end; /* right align icons inside */
}

#social-networking li {
    float: none;
}

nav#menu {
    position: relative;
    z-index: 10;            /* below socials */
    width: 100%;
    text-align: right;
}