/*
Theme Name: njc_twentyseventeen
wotb_styles.css 
Custom styles for njc_twentyseventeen theme
Author: RM 


/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Normalize
2.0 Accessibility
3.0 Alignments
4.0 Clearings
5.0 Typography
6.0 Forms
7.0 Formatting
8.0 Lists
9.0 Tables
10.0 Links
11.0 Featured Image Hover
12.0 Navigation
13.0 Layout
   13.1 Header
   13.2 Front Page
   13.3 Regular Content
   13.4 Posts
   13.5 Pages
   13.6 Footer
14.0 Comments
15.0 Widgets
16.0 Media
   16.1 Galleries
17.0 Customizer
18.0 SVGs Fallbacks
19.0 Media Queries
20.0 Print
--------------------------------------------------------------*/

/*--------------------------------------------------------------
1.0 Normalize
Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
--------------------------------------------------------------*/
/*RM - main stylesheet imported from minimaze via functions.php */


/*--------------------------------------------------------------
5.0 Typography
--------------------------------------------------------------*/
 
 body,
button,
input,
select,
textarea {
	color: #333;
	font-family: verdana,Helvetica,Arial,sans-serif;
	font-size: 15px;
	/*font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.66;*/
}

/*--------------------------------------------------------------
6.0 Forms
--------------------------------------------------------------*/



/*--------------------------------------------------------------
7.0 Formatting
--------------------------------------------------------------*/



/*--------------------------------------------------------------
8.0 Lists
--------------------------------------------------------------*/

ul,
ol {
	margin-left:  1.0em;
	padding: 0;
}


/*--------------------------------------------------------------
9.0 Tables
--------------------------------------------------------------*/



/*--------------------------------------------------------------
10.0 Links
--------------------------------------------------------------*/
a {
	color: #222;
	text-decoration: underline;
}

a:focus {
	outline: thin dotted;
}

a:hover,
a:active {
	color: #CC0000;
	outline: 0;
}

/* Hover effects */

.entry-content a,
.entry-summary a,
.widget a,
.site-footer .widget-area a,
.posts-navigation a,
.widget_authors a strong {
	-webkit-box-shadow: none;
	box-shadow: none;
}

.entry-title a,
.entry-meta a,
.page-links a,
.page-links a .page-number,
.entry-footer a,
.entry-footer .cat-links a,
.entry-footer .tags-links a,
.edit-link a,
.post-navigation a,
.logged-in-as a,
.comment-navigation a,
.comment-metadata a,
.comment-metadata a.comment-edit-link,
.comment-reply-link,
a .nav-title,
.pagination a,
.comments-pagination a,
.site-info a,
.widget .widget-title a,
.widget ul li a,
.site-footer .widget-area ul li a,
.site-footer .widget-area ul li a {
	-webkit-box-shadow: none;
	box-shadow: none;
	text-decoration: none;
}


.entry-content a:focus,
.entry-content a:hover,
.entry-summary a:focus,
.entry-summary a:hover,
.widget a:focus,
.widget a:hover,
.site-footer .widget-area a:focus,
.site-footer .widget-area a:hover,
.posts-navigation a:focus,
.posts-navigation a:hover,
.comment-metadata a:focus,
.comment-metadata a:hover,
.comment-metadata a.comment-edit-link:focus,
.comment-metadata a.comment-edit-link:hover,
.comment-reply-link:focus,
.comment-reply-link:hover,
.widget_authors a:focus strong,
.widget_authors a:hover strong,
.entry-title a:focus,
.entry-title a:hover,
.entry-meta a:focus,
.entry-meta a:hover,
.page-links a:focus .page-number,
.page-links a:hover .page-number,
.entry-footer a:focus,
.entry-footer a:hover,
.entry-footer .cat-links a:focus,
.entry-footer .cat-links a:hover,
.entry-footer .tags-links a:focus,
.entry-footer .tags-links a:hover,
.post-navigation a:focus,
.post-navigation a:hover,
.pagination a:not(.prev):not(.next):focus,
.pagination a:not(.prev):not(.next):hover,
.comments-pagination a:not(.prev):not(.next):focus,
.comments-pagination a:not(.prev):not(.next):hover,
.logged-in-as a:focus,
.logged-in-as a:hover,
/*a:focus .nav-title,
a:hover .nav-title,*/
.edit-link a:focus,
.edit-link a:hover,
.site-info a:focus,
.site-info a:hover,
.widget .widget-title a:focus,
.widget .widget-title a:hover,
.widget ul li a:focus,
.widget ul li a:hover {
	color: #CC0000;
	-webkit-box-shadow:none;
	box-shadow: none;
}

/* Fixes linked images */
.entry-content a img,
.widget a img {
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 2px solid #cccccc;
}

.post-navigation a:focus .icon,
.post-navigation a:hover .icon {
	color: #CCC;
}
/*--------------------------------------------------------------
11.0 Featured Image Hover
--------------------------------------------------------------*/



/*--------------------------------------------------------------
12.0 Navigation
--------------------------------------------------------------*/

.navigation-top {
	background: #323232;
	border-bottom: 1px solid #feca98;
	border-top: 1px solid #feca98;
}
.navigation-top .wrap {
	max-width: 1080px;
	padding: 0;
}

.home .custom-header {
	display: none;
}
.home .site-header  {
	margin: 0;
}


/*.main-navigation li a {
    border-bottom: 0 none;
    border-right: 1px solid #feca98;
    color: #feca98;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1;
    margin: 8px 0;
    padding: 0 16px;
    text-transform: uppercase;
    white-space: nowrap;
}*/

.js .main-navigation.toggled-on > div > ul {
    background: #444;
    display: block;
}

.dropdown-toggle {
    background-color: transparent;
    border: 0 none;
    box-shadow: none;
    color: #FFF;
    display: block;
    font-size: 16px;
    line-height: 1.5;
    margin: 0 auto;
    padding: 0.5em;
    position: absolute;
    right: -0.5em;
    text-shadow: none;
    top: 0;
}

.navigation-top a {
	color: #feca98;
    font-size: 12px;
    font-weight: bold;
    letter-spacing: 1px;
    line-height: 1;
    margin: 8px 0;
    padding: 0 16px;
    text-transform: uppercase;
    white-space: nowrap;

	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}


.navigation-top .current-menu-item > a,
.navigation-top .current_page_item > a {
	color: #bc843a;/*#767676*/
}

.main-navigation.toggled-on ul ul.toggled-on {
    background: #444;
    display: block;
}

.main-navigation.toggled-on li{
    border-bottom: 1px solid #999;
    position: relative;
}

.main-navigation.toggled-on ul ul.toggled-on li{
    border: none;
}

.main-navigation.toggled-on  a {
	color: #FFF;
    font-size: 12px;
    font-weight: normal;
    margin: 8px 0;
    padding: 8px 16px;
    text-transform: uppercase;
}

.main-navigation.toggled-on .current-menu-item > a,
.main-navigation.toggled-on .current_page_item > a {
	color: #CCC;/*#767676*/
}


.main-navigation ul {
	
}

.main-navigation li li a {
	color: #222;
}

.main-navigation a:hover {
	color: #FFF;
}
 
.main-navigation.toggled-on a:hover {
	color: #999;
}


.menu-toggle {
    background-color: transparent;
    border: 0 none;
    box-shadow: none;
    color: #FFF;
    display: none;
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1.5;
    margin: 1px 4px 2px;
    /*padding: 1em;*/
    text-align: right;
    text-shadow: none;
    width: 99%;
    box-sizing: border-box;
}
/*--------------------------------------------------------------
13.0 Layout
--------------------------------------------------------------*/
body, .site-header, .site-content-contain {
		background: url('images/bricks-full-desabkg_1200w.jpg') repeat scroll left top #090100;
	/* Fallback for when there is no custom background color defined. */
}

#page {
	margin-top: 30px;
	border-top: 1px solid #feca98;
}

.home #page {
	margin-top: 0;
	border-top: none;
}


.site-content-contain {
	background: url('images/bricks-full-desabkg_1200w.jpg') repeat scroll left top #090100;
}

.wrap {
	margin-left: auto;
	margin-right: auto;
	max-width: 700px;
	padding:0
	/*padding-left: 2em;
	padding-right: 2em;*/
}
  /*--------------------------------------------------------------
   13.1 Header
   --------------------------------------------------------------*/

.custom-header {
	background: #090100;
}
   
body:not(.title-tagline-hidden) .site-branding-text {
	display: inline-block;
	vertical-align: middle;
	color: #FFF;
	float: right;
	padding: 0 10px;
	box-sizing: border-box;
	background: rgba(0,0,0, 0.44);/*#CCC*/
}


/* Site branding */

.site-branding {
	color: #FFF;
	font-family: georgia;
	background: url('images/njc_2017_header_static_02.jpg') no-repeat scroll left top #090100;
	max-width: 1080px;/*1200px*/
	margin: 0 auto;
}

.site-branding .wrap{
	max-width: 600px;/*500px*/
	padding:0;
}

.site-title {
	clear: none;
	/*font-size: 24px;
	font-size: 1.5rem;*/
	font-size: 30px;
	font-size: 1.8rem;
	font-weight: normal;
	line-height: 1.25;
	letter-spacing: 0.08em;
	margin: 0;
	padding: 0;
	text-transform: none;
	color: #FFF;
}
/*.site-title {
	 color: #FFF;
	font-weight: normal;
	line-height: 1.25;
	 
	text-transform: none;
}*/
.site-title, .site-title a, .site-description, .site-description a {
    color: #FFF;
    opacity: 1;
}

.site-branding a:hover,
.site-branding a:focus {
	opacity: 0.95;
}
  /*--------------------------------------------------------------
   13.2 Front Page
   --------------------------------------------------------------*/

  /*--------------------------------------------------------------
   13.3 Regular Content
   --------------------------------------------------------------*/

  /*--------------------------------------------------------------
   13.4 Posts
   --------------------------------------------------------------*/
/* Single Post */

.single-post:not(.has-sidebar) #primary,
.page.page-one-column:not(.twentyseventeen-front-page) #primary,
.archive.page-one-column:not(.has-sidebar) .page-header,
.archive.page-one-column:not(.has-sidebar) #primary {
	margin-left: auto;
	margin-right: auto;
	max-width: 740px;
	background: #FFF;
}

article {
	padding: 10px 20px;
	box-sizing: border-box;
	background: #FFF;
}

body.home article {
	padding: 10px 20px;
	box-sizing: border-box;
	background: #090100;
}

.page .panel-content .entry-title,
.page-title,
body.page:not(.twentyseventeen-front-page) .entry-title {
	color: #222;
	font-family: georgia,times new roman;
	font-size: 20px;
	text-transform: none;
	font-weight: normal;
}

body.home .entry-header h2.entry-title {
	color: #FFF;
	display: none;
}

.archive .page-title {
	color: #FFF;
}

.single .byline,
.group-blog .byline {
	display: none;
}

/* Post Navigation */


.nav-subtitle {
	color: #CCC;
}

.nav-title {
	color: #FFF;
	font-weight:normal;
}

a:focus .nav-title,
a:hover .nav-title,
nav-title-icon-wrapper:hover {
	color: #CCC;
}

  /*--------------------------------------------------------------
   13.5 Pages
   --------------------------------------------------------------*/
	/* Pages */

	#content {
		padding: 1em;
	}

  /*--------------------------------------------------------------
   13.6 Footer
   --------------------------------------------------------------*/

.site-footer {
	border-top: 1px solid #feca98;
	background: rgba(0,0,0, 0.4);/*#CCC*/
}

.site-footer .wrap {
	max-width: 1080px;
	padding: 2em 0.5em 1.5em;
}

/* Footer widgets */

.site-footer .widget-area {
	padding-bottom: 2em;
	padding-top: 0; /*2em*/
}

/*--------------------------------------------------------------
14.0 Comments
--------------------------------------------------------------*/



/*--------------------------------------------------------------
15.0 Widgets
--------------------------------------------------------------*/

#secondary {
	padding: 1em 0 2em;
	color: #FFF;
}

#secondary section {
	/*border-top: 1px solid #fff;*/
    font-family: georgia,times new roman;
    font-size: 1.1em;
    padding-top: 10px;
}

body.home #secondary section {
	border-top: none;

}

#secondary section.widget_simpleimage {
	border-top: none;
}


h2.widget-title {
	color: #FFF;
	font-size: 13px;
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.1818em;
	margin-bottom: 1.5em;
	text-transform: uppercase;
}


.widget_nav_menu a {
	color: #FFF;
}


.widget ul li {
	border: none;
}


#menu-footer_menu  li {
	display: block;
}
#menu-footer_menu  li a{
	padding: 2px 20px;
}

#menu-footer_menu  li a:hover{
	color:#feca98;
}


/* 'buy the book' button in sidebar */
section#nav_menu-8 {
	border: none;
}
 #secondary .widget.widget_nav_menu .menu a{
 		display:block;
 		width: 210px;
		border: 1px solid #FECA98;
		padding: 4px 10px;
		margin-bottom: 16px;
		margin-bottom:1.1428rem;
		margin-left: auto;
		margin-right: auto;
		text-decoration: none;
		color: #FECA98;
		text-transform: uppercase;
		text-align: center;
		font-weight: bold;
		font-size: 11px;
		font-size: 0.7857rem;
	}
	#secondary .widget.widget_nav_menu .menu a:hover{
 		color: #EEEEEE;
	}
/*--------------------------------------------------------------
16.0 Media
--------------------------------------------------------------*/



/*--------------------------------------------------------------
   16.1 Galleries
   --------------------------------------------------------------*/



/*--------------------------------------------------------------
17.0 Customizer
--------------------------------------------------------------*/



/*--------------------------------------------------------------
18.0 SVGs Fallbacks
--------------------------------------------------------------*/





/* ////////////--------------------------------------------------------------
19.0 Media Queries
--------------------------------------------------------------/////////////////// */


/* Adjust positioning of edit shortcuts, override style in customize-preview.css */
@media screen and (min-width: 20em) {


}


@media screen and (min-width: 30em) {
	#menu-footer_menu  li {
		display: inline-block;
	}
}

@media screen and (min-width: 48em) {


	.home .site-header  {
		margin: 20px 0 0 0;
	}

	/* Site Branding */
	body:not(.title-tagline-hidden) .site-branding-text {
		
	}
	
	.site-title {
		font-size: 36px;
		font-size: 2.25rem;
	}

	.site-description {
		font-size: 16px;
		font-size: 1rem;
	}

	/* Layout */
	#content {
		padding: 0 1.6em;
	}
	
	.site-content .wrap {
		max-width: 1080px;
		padding: 2em;/*3em*/
		background: #090100;
		border-left: 1px solid #333;/*#feca98*/
		border-right: 1px solid #333;/*#feca98*/
	}
	.panel-content .wrap {
		border: none;
		padding-top: 1em;
	}
	.navigation-top .wrap {
		/*max-width: 1080px;
		The font size is 14px here and we need 50px padding in ems 
		padding: 0.75em 3.4166666666667em;*/
	}
	.has-sidebar:not(.error404) #primary {
		float: left;
		width: 62%;
	}

	.has-sidebar #secondary {
		float: right;
		padding-top: 0;
		width: 32%;
	}
	
	.page:not(.home) #content {
		padding-bottom: 0; /*1.25em*/
	}
	/* Footer */

	.site-footer {
		font-size: 14px;
		font-size: 0.875rem;
		line-height: 1.6;
		margin-top: 0;
	}
	

	/* Pages */

	.page.page-one-column .entry-header,
	.twentyseventeen-front-page.page-one-column .entry-header,
	.archive.page-one-column:not(.has-sidebar) .page-header {
		margin-bottom: 0; /* 1em 4em*/
	}
	
	.blog .site-main > article,
	.archive .site-main > article,
	.search .site-main > article {
		padding-bottom: 1em;
	}

}

@media screen and ( min-width: 50em ) {



}

@media screen and (min-width: 64em) { /* moved Navigation from min-width: 48em*/
	.home #page {
		margin-top: 30px;
		border-top: 1px solid #feca98;
	}
	
}
@media screen and ( min-width: 67em ) {


}

@media screen and ( min-width: 79em ) {

}

@media screen and ( max-width: 48.875em ) and ( min-width: 48em ) {
 .navigation-top a {
	color: #222;

}

.navigation-top .current-menu-item > a,
.navigation-top .current_page_item > a {
	color: #red;/*#767676*/
}
 
}





/*--------------------------------------------------------------
20.0 Print
--------------------------------------------------------------*/


@media print {

}